mirror of
https://github.com/captbaritone/webamp.git
synced 2026-07-25 19:13:54 +00:00
Refactor how we handle special NUM_EX CSS
This commit is contained in:
parent
1fe9fe5da7
commit
3ef2bf7041
3 changed files with 10 additions and 18 deletions
|
|
@ -161,6 +161,7 @@
|
|||
}
|
||||
|
||||
#winamp2-js .status #time #minus-sign {
|
||||
/* Note that this get's augmented by the skin CSS if NUM_EX.BMP is present */
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: -1px;
|
||||
|
|
@ -168,13 +169,6 @@
|
|||
height: 1px;
|
||||
}
|
||||
|
||||
/* Alternate format for minus sign, when skin supports it */
|
||||
#winamp2-js .status #time.ex #minus-sign {
|
||||
top: 0px;
|
||||
left: -1px;
|
||||
width: 9px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
#winamp2-js .status #time #minute-first-digit {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -94,8 +94,8 @@ module.exports = [
|
|||
{
|
||||
img: 'NUMS_EX',
|
||||
sprites: [
|
||||
{selectors: ['#time.ex #minus-sign'], x: 90, y: 0, width: 9, height: 13},
|
||||
{selectors: ['#time.ex.countdown #minus-sign'], x: 99, y: 0, width: 9, height: 13},
|
||||
{selectors: ['#time #minus-sign'], x: 90, y: 0, width: 9, height: 13},
|
||||
{selectors: ['#time.countdown #minus-sign'], x: 99, y: 0, width: 9, height: 13},
|
||||
{selectors: ['.digit-0'], x: 0, y: 0, width: 9, height: 13},
|
||||
{selectors: ['.digit-1'], x: 9, y: 0, width: 9, height: 13},
|
||||
{selectors: ['.digit-2'], x: 18, y: 0, width: 9, height: 13},
|
||||
|
|
|
|||
16
js/skin.js
16
js/skin.js
|
|
@ -25,18 +25,11 @@ module.exports = {
|
|||
// Gets passed as a callback, so don't have access to `this`
|
||||
_setSkinByBuffer: function(buffer) {
|
||||
var zip = new JSZip(buffer);
|
||||
document.getElementById('time').classList.remove('ex');
|
||||
|
||||
var promisedCssRules = this._skinSprites.map(function(spriteObj) {
|
||||
|
||||
var file = this._findFileInZip(spriteObj.img, zip);
|
||||
if (file) {
|
||||
// CSS has to change if this file is present
|
||||
if (spriteObj.img === 'NUMS_EX') {
|
||||
document.getElementById('time').classList.add('ex');
|
||||
}
|
||||
var src = 'data:image/bmp;base64,' + btoa(file.asBinary());
|
||||
return this._spriteCssRule(src, spriteObj);
|
||||
return this._spriteCssRule(spriteObj.img, src, spriteObj);
|
||||
}
|
||||
}, this);
|
||||
|
||||
|
|
@ -85,7 +78,7 @@ module.exports = {
|
|||
|
||||
// Given an image URL and coordinates, returns a data url for a sub-section
|
||||
// of that image
|
||||
_spriteCssRule: function(src, spriteObj) {
|
||||
_spriteCssRule: function(img, src, spriteObj) {
|
||||
return new Promise(function(resolve) {
|
||||
var imageObj = new Image();
|
||||
imageObj.src = src;
|
||||
|
|
@ -105,6 +98,11 @@ module.exports = {
|
|||
cssRules += '#winamp2-js ' + selector + '{' + value + '}\n';
|
||||
});
|
||||
});
|
||||
if (img === 'NUMS_EX') {
|
||||
// This alternate number file requires that the minus sign be
|
||||
// formatted differently.
|
||||
cssRules += '#winamp2-js .status #time #minus-sign { top: 0px; left: -1px; width: 9px; height: 13px; }\n';
|
||||
}
|
||||
resolve(cssRules);
|
||||
};
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue