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

Add inline songs/image lists.

Browse Source
serial
William Toohey 10 years ago
parent 0196197f58
commit e60b2bc868
7 changed files with 225 additions and 110 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. 12
      css/hues-m.css
  2. 6
      css/hues-r.css
  3. 21
      css/hues-res.css
  4. 19
      js/HuesCore.js
  5. 4
      js/HuesSettings.js
  6. 204
      js/HuesUI.js
  7. 69
      js/ResourceManager.js

12
css/hues-m.css
Unescape View File

@ -378,6 +378,12 @@
height: 12px;
}
.hues-m-listcontainer {
position: absolute;
right: 8px;
bottom: 110px;
}
/* Fun slider stuff! */
input[type=range] {
@ -482,4 +488,10 @@ input[type=range]::-ms-thumb {
width: 192px;
height: 54px;
}
.hues-m-listcontainer {
bottom: 60px;
max-width: 992px;
margin: 0 auto;
left: 8px;
}
}

6
css/hues-r.css
Unescape View File

@ -104,4 +104,10 @@
.hues-r-container.hidden, .hues-r-controls.hidden, .hues-r-subcontrols.hidden {
transform: translateY(200px);
-webkit-transform: translateY(200px);
}
.hues-r-listcontainer {
position: absolute;
right: 35px;
bottom: 45px;
}

21
css/hues-res.css
Unescape View File

@ -243,4 +243,25 @@
-webkit-flex-grow: 1;
flex-grow: 1;
text-align: center;
}
#res-enabledsonglist, #res-enabledimagelist {
display: block;
position: absolute;
bottom: 0;
right: 0;
max-height: 150px;
overflow: auto;
}
#res-enabledsonglist.hidden, #res-enabledimagelist.hidden {
display: none;
}
#res-enabledsonglist {
width: 515px;
}
#res-enabledimagelist {
width: 315px;
}

19
js/HuesCore.js
Unescape View File

@ -231,7 +231,6 @@ HuesCore.prototype.startSongChangeFade = function() {
HuesCore.prototype.songDataUpdated = function() {
if (this.currentSong) {
this.beatLength = 0;
this.userInterface.updateLists();
this.userInterface.setSongText();
this.userInterface.setImageText();
} else {
@ -436,7 +435,6 @@ HuesCore.prototype.toggleFullAuto = function() {
HuesCore.prototype.respackLoaded = function() {
this.init();
this.userInterface.updateLists();
}
/*HuesCore.prototype.rightClickListener = function(event) {
@ -456,11 +454,11 @@ HuesCore.prototype.respackLoaded = function() {
HuesCore.prototype.changeUI = function(index) {
if (index >= 0 && this.uiArray.length > index && !(this.userInterface == this.uiArray[index])) {
this.hideLists();
if(this.userInterface)
this.userInterface.disconnect();
this.userInterface = this.uiArray[index];
this.userInterface.connectCore(this);
this.userInterface.updateLists();
this.userInterface.setSongText();
this.userInterface.setImageText();
this.userInterface.setColourText(this.colourIndex);
@ -518,22 +516,20 @@ HuesCore.prototype.settingsUpdated = function() {
HuesCore.prototype.enabledChanged = function() {
this.resourceManager.rebuildEnabled();
this.userInterface.updateLists();
}
HuesCore.prototype.hideLists = function() {
this.userInterface.songList.hide();
this.userInterface.imageList.hide();
this.resourceManager.hideLists();
}
HuesCore.prototype.toggleSongList = function() {
this.userInterface.songList.toggleHide();
this.userInterface.imageList.hide();
this.settings.hide();
this.resourceManager.toggleSongList();
}
HuesCore.prototype.toggleImageList = function() {
this.userInterface.imageList.toggleHide();
this.userInterface.songList.hide();
this.settings.hide();
this.resourceManager.toggleImageList();
}
HuesCore.prototype.openSongSource = function() {
@ -605,9 +601,6 @@ HuesCore.prototype.keyHandler = function(key) {
case 52: // NUMBER_4
this.settings.set("currentUI", "xmas");
break;
case 76: // L
this.loadLocal();
break;
case 67: // C
this.toggleImageList();
break;

4
js/HuesSettings.js
Unescape View File

@ -105,6 +105,8 @@ HuesSettings.prototype.connectCore = function(core) {
};
HuesSettings.prototype.show = function() {
if(this.core)
this.core.hideLists();
this.window.style.display = "block";
}
@ -115,6 +117,8 @@ HuesSettings.prototype.hide = function() {
HuesSettings.prototype.toggle = function() {
if(this.window.style.display == "none") {
this.window.style.display = "block";
if(this.core)
this.core.hideLists();
} else {
this.window.style.display = "none";
}

204
js/HuesUI.js
Unescape View File

@ -35,6 +35,9 @@ function HuesUI(parent) {
this.settingsToggle = null;
this.hideToggle = null;
// Put this near the links to song/image lists/ Bottom right alignment
this.listContainer = null;
this.hidden = false;
this.initUI();
@ -93,7 +96,7 @@ HuesUI.prototype.initUI = function() {
this.timer.textContent = "T=$0x0000";
this.beatCount = document.createElement("div");
this.beatCount.textContent = "B=$0x00";
this.beatCount.textContent = "B=$0x000";
this.xBlur = document.createElement("div");
this.xBlur.textContent = "X=$0x00";
@ -113,16 +116,22 @@ HuesUI.prototype.initUI = function() {
this.hideToggle.onclick = function() {
that.toggleHide();
}
this.listContainer = document.createElement("div");
}
HuesUI.prototype.connectCore = function(core) {
this.core = core;
this.root.style.display = "block";
this.listContainer.appendChild(core.resourceManager.listView);
}
HuesUI.prototype.disconnect = function() {
this.core = null;
this.root.style.display = "none";
while (this.listContainer.firstElementChild) {
this.listContainer.removeChild(this.listContainer.firstElementChild);
}
}
// ONLY FOR CHANGING UI, NOT FOR "HIDE" FEATURE
@ -178,12 +187,6 @@ HuesUI.prototype.setColourText = function(colour) {
this.hueName.textContent = colour.n.toUpperCase();
}
HuesUI.prototype.updateLists = function() {
var songs = this.core.resourceManager.enabledSongs;
var images = this.core.resourceManager.enabledImages;
// TODO display this
}
HuesUI.prototype.blurUpdated = function(x, y) {
x = Math.floor(x * 0xFF);
y = Math.floor(y * 0xFF);;
@ -305,6 +308,9 @@ RetroUI.prototype.initUI = function() {
that.toggleHide();
}
this.root.appendChild(this.hideRestore);
this.listContainer.className = "hues-r-listcontainer";
this.root.appendChild(this.listContainer);
}
RetroUI.prototype.toggleHide = function(stylename) {
@ -359,6 +365,87 @@ RetroUI.prototype.beat = function() {
this.beatCount.textContent = "B=" + this.intToHex3(this.core.getSafeBeatIndex());
}
function WeedUI() {
RetroUI.call(this);
this.xVariance = 10;
this.yVariance = 20;
}
WeedUI.prototype = Object.create(RetroUI.prototype);
WeedUI.prototype.constructor = WeedUI;
WeedUI.prototype.initUI = function() {
RetroUI.prototype.initUI.call(this);
this.container.removeChild(this.beatBar)
this.controls.className = "hues-w-controls";
this.subControls.className = "hues-w-subcontrols";
var beatBar = document.createElement("div");
beatBar.className = "hues-w-beatbar";
this.root.appendChild(beatBar);
this.beatBar = beatBar;
var beatLeft = document.createElement("div");
beatLeft.className = "hues-w-beatleft";
beatBar.appendChild(beatLeft);
this.beatLeft = beatLeft;
var beatRight = document.createElement("div");
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() {
var beats = this.core.getBeatString();
var rest = beats.slice(1);
this.beatLeft.textContent = rest;
this.beatRight.textContent = rest;
this.beatCount.textContent = "B=" + this.intToHex3(this.core.getSafeBeatIndex());
if(["x", "o", "X", "O"].indexOf(beats[0]) != -1) {
var beatCenter = document.createElement("div");
beatCenter.className = "hues-w-beataccent";
var rot = this.round10(15 - Math.random() * 30);
var x = this.round10(- this.xVariance / 2 + Math.random() * this.xVariance);
var y = this.round10(30 - this.yVariance / 2 + Math.random() * this.yVariance);
var transform = "rotate(" + rot + "deg) translate(" + x + "px," + y + "px)";
beatCenter.style.MozTransform = transform;
beatCenter.style.webkitTransform = transform;
beatCenter.style.transform = transform;
beatCenter.textContent = beats[0].toUpperCase();
this.root.appendChild(beatCenter);
window.setTimeout(this.getRemoveBeat(beatCenter), 1500);
}
}
WeedUI.prototype.round10 = function(num) {
return Math.round(num * 10) / 10;
}
WeedUI.prototype.getRemoveBeat = function(element) {
var that = this;
return function() {
that.root.removeChild(element);
};
}
function ModernUI() {
this.beatBar = null;
this.beatLeft = null;
@ -370,6 +457,7 @@ function ModernUI() {
this.leftInfo = null;
this.controls = null;
this.volInput = null;
this.volLabel = null;
this.hideRestore = null;
HuesUI.call(this);
@ -421,13 +509,10 @@ ModernUI.prototype.initUI = function() {
label.textContent = "VOL";
label.className = "hues-m-vol-label";
label.onclick = function() {
if(that.core.soundManager.toggleMute()) {
this.textContent = "(VOL)";
} else {
this.textContent = "VOL";
};
that.core.soundManager.toggleMute()
};
volBar.appendChild(label);
this.volLabel = label;
var infoToggle = document.createElement("div");
infoToggle.innerHTML = '?';
@ -475,9 +560,7 @@ ModernUI.prototype.initUI = function() {
var images = document.createElement("div");
images.className = "hues-m-controlblock";
var imageList = document.createElement("div");
imageList.textContent = "IMAGES";
imageList.className = "hues-m-songbutton";
this.imageList.className = "hues-m-songbutton";
var imageControls = document.createElement("div");
imageControls.className = "hues-m-controlbuttons";
@ -488,7 +571,7 @@ ModernUI.prototype.initUI = function() {
this.imageMode.onclick = function() {that.core.toggleFullAuto();};
this.imagePrev.className = "hues-m-prevbutton";
this.imageNext.className = "hues-m-nextbutton";
images.appendChild(imageList);
images.appendChild(this.imageList);
imageControls.appendChild(this.imagePrev);
imageControls.appendChild(this.imageMode);
imageControls.appendChild(this.imageNext);
@ -534,6 +617,9 @@ ModernUI.prototype.initUI = function() {
that.toggleHide();
}
this.root.appendChild(this.hideRestore);
this.listContainer.className = "hues-m-listcontainer";
this.root.appendChild(this.listContainer);
}
ModernUI.prototype.toggleHide = function() {
@ -554,6 +640,11 @@ ModernUI.prototype.toggleHide = function() {
ModernUI.prototype.updateVolume = function(vol) {
this.volInput.value = vol;
if(vol == 0) {
this.volLabel.textContent = "(VOL)";
} else {
this.volLabel.textContent = "VOL";
};
}
ModernUI.prototype.modeUpdated = function() {
@ -619,87 +710,6 @@ ModernUI.prototype.setImageText = function() {
}
}
function WeedUI() {
RetroUI.call(this);
this.xVariance = 10;
this.yVariance = 20;
}
WeedUI.prototype = Object.create(RetroUI.prototype);
WeedUI.prototype.constructor = WeedUI;
WeedUI.prototype.initUI = function() {
RetroUI.prototype.initUI.call(this);
this.container.removeChild(this.beatBar)
this.controls.className = "hues-w-controls";
this.subControls.className = "hues-w-subcontrols";
var beatBar = document.createElement("div");
beatBar.className = "hues-w-beatbar";
this.root.appendChild(beatBar);
this.beatBar = beatBar;
var beatLeft = document.createElement("div");
beatLeft.className = "hues-w-beatleft";
beatBar.appendChild(beatLeft);
this.beatLeft = beatLeft;
var beatRight = document.createElement("div");
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() {
var beats = this.core.getBeatString();
var rest = beats.slice(1);
this.beatLeft.textContent = rest;
this.beatRight.textContent = rest;
this.beatCount.textContent = "B=" + this.intToHex3(this.core.getSafeBeatIndex());
if(["x", "o", "X", "O"].indexOf(beats[0]) != -1) {
var beatCenter = document.createElement("div");
beatCenter.className = "hues-w-beataccent";
var rot = this.round10(15 - Math.random() * 30);
var x = this.round10(- this.xVariance / 2 + Math.random() * this.xVariance);
var y = this.round10(30 - this.yVariance / 2 + Math.random() * this.yVariance);
var transform = "rotate(" + rot + "deg) translate(" + x + "px," + y + "px)";
beatCenter.style.MozTransform = transform;
beatCenter.style.webkitTransform = transform;
beatCenter.style.transform = transform;
beatCenter.textContent = beats[0].toUpperCase();
this.root.appendChild(beatCenter);
window.setTimeout(this.getRemoveBeat(beatCenter), 1500);
}
}
WeedUI.prototype.round10 = function(num) {
return Math.round(num * 10) / 10;
}
WeedUI.prototype.getRemoveBeat = function(element) {
var that = this;
return function() {
that.root.removeChild(element);
};
}
function XmasUI() {
ModernUI.call(this);

69
js/ResourceManager.js
Unescape View File

@ -18,6 +18,10 @@ function Resources(core) {
this.progressCallback = null;
this.root = null;
// For songs/images
this.listView = null;
this.enabledSongList = null;
this.enabledImageList = null;
this.packView = {
pack: null,
name: null,
@ -154,9 +158,40 @@ Resources.prototype.rebuildEnabled = function() {
}
}
}
var songList = this.enabledSongList;
while(songList.firstElementChild) {
songList.removeChild(songList.firstElementChild)
}
var imageList = this.enabledImageList;
while(imageList.firstElementChild) {
imageList.removeChild(imageList.firstElementChild)
}
for(var i = 0; i < this.enabledSongs.length; i++) {
var song = this.enabledSongs[i];
this.appendSimpleListItem(song.title, songList, this.playSongCallback(i));
}
for(var i = 0; i < this.enabledImages.length; i++) {
var image = this.enabledImages[i];
this.appendSimpleListItem(image.name, imageList, this.selectImageCallback(i));
}
this.updateTotals();
}
Resources.prototype.playSongCallback = function(index) {
var that = this;
return function() {
that.core.setSong(index);
};
}
Resources.prototype.selectImageCallback = function(index) {
var that = this;
return function() {
that.core.setImage(index);
};
}
Resources.prototype.removePack = function(pack) {
var index = this.resourcePacks.indexOf(pack);
if (index != -1) {
@ -433,6 +468,40 @@ Resources.prototype.initUI = function() {
this.root.appendChild(packsContainer);
this.root.appendChild(indivView);
this.listView = document.createElement("div");
this.enabledSongList = document.createElement("div");
this.enabledSongList.id = "res-enabledsonglist";
this.enabledSongList.className = "hidden";
this.enabledImageList = document.createElement("div");
this.enabledImageList.id = "res-enabledimagelist";
this.enabledImageList.className = "hidden";
this.listView.appendChild(this.enabledSongList);
this.listView.appendChild(this.enabledImageList);
}
Resources.prototype.hideLists = function() {
this.enabledSongList.className = "hidden";
this.enabledImageList.className = "hidden";
}
Resources.prototype.toggleSongList = function() {
if(this.enabledSongList.className == "hidden") {
this.enabledSongList.className = "res-list";
} else {
this.enabledSongList.className = "hidden";
}
this.enabledImageList.className = "hidden";
}
Resources.prototype.toggleImageList = function() {
if(this.enabledImageList.className == "hidden") {
this.enabledImageList.className = "res-list";
} else {
this.enabledImageList.className = "hidden";
}
this.enabledSongList.className = "hidden";
}
Resources.prototype.updateTotals = function() {

Write Preview
Loading…
Cancel
Save