mirror of
https://github.com/captbaritone/webamp.git
synced 2026-07-25 11:04:00 +00:00
Render visualization background
This commit is contained in:
parent
b619dacd87
commit
d8347a376d
2 changed files with 24 additions and 1 deletions
|
|
@ -15,6 +15,12 @@ Visualizer = {
|
|||
this.dataArray = null;
|
||||
this.setStyle(this.BAR);
|
||||
|
||||
// Off-screen canvas for pre-rendering the background
|
||||
this.bgCanvas = document.createElement('canvas');
|
||||
this.bgCanvas.width = this.width;
|
||||
this.bgCanvas.height = this.height;
|
||||
this.bgCanvasCtx = this.bgCanvas.getContext("2d");
|
||||
|
||||
// Off-screen canvas for pre-rendering a single bar gradient
|
||||
this.barCanvas = document.createElement('canvas');
|
||||
this.barCanvas.width = 6;
|
||||
|
|
@ -24,14 +30,27 @@ Visualizer = {
|
|||
},
|
||||
|
||||
clear: function() {
|
||||
this.canvasCtx.clearRect(0, 0, this.width, this.height);
|
||||
this.canvasCtx.drawImage(this.bgCanvas, 0, 0);
|
||||
},
|
||||
|
||||
setColors: function(colors) {
|
||||
this.colors = colors;
|
||||
this.preRenderBg();
|
||||
this.preRenderBar();
|
||||
},
|
||||
|
||||
// Pre-render the background grid
|
||||
preRenderBg: function() {
|
||||
this.bgCanvasCtx.fillStyle = this.colors[0];
|
||||
this.bgCanvasCtx.fillRect(0,0,this.width, this.height);
|
||||
this.bgCanvasCtx.fillStyle = this.colors[1];
|
||||
for(x = 0; x < this.width; x += 4) {
|
||||
for(y = 0; y < this.height; y += 4) {
|
||||
this.bgCanvasCtx.fillRect(x,y,2,2);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Pre-render the bar gradient
|
||||
preRenderBar: function() {
|
||||
this.barCanvasCtx.fillStyle = this.colors[23];
|
||||
|
|
|
|||
|
|
@ -227,6 +227,10 @@ a:focus { outline: none; }
|
|||
left: 24px;
|
||||
}
|
||||
|
||||
.stop #visualizer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.text {
|
||||
position: absolute;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue