drop_c: 0,
drops: [],
perspective: 0.3,
+ preferences: [
+ {name: "intensity", label: "Intensity", kind: "Slider", maximum: 1, minimum: 0, snap: 0.01},
+ {name: "rainColor", label: "Rain Color", kind: "ListSelector", items: ["gray", "black", "blue", "red"]},
+ {name: "backgroundColor", label: "Background Color", kind: "ListSelector", items: [
+ {caption: "white", value: 'rgba(255,255,255,0.7)'},
+ {caption: "black", value: 'rgba(0,0,0,0.7)'}
+ ]}
+ ],
+ intensity: 0.7,
+ rainColor: 'gray',
+ backgroundColor: 'rgba(255,255,255,0.7)',
components: [
{name: "raindrops", nodeTag: "canvas"}
],
this.raindrops.width = this.w = w;
this.raindrops.height = this.h = h;
- this.ctx.fillStyle = 'rgba(255,255,255,0.7)';
- this.ctx.strokeStyle = 'rgb(128,128,128)';
+ this.ctx.fillStyle = this.backgroundColor;
+ this.ctx.strokeStyle = this.rainColor;
this.ctx.lineWidth = '2';
},
+ preferencesChanged: function() {
+ this.ctx.fillStyle = this.backgroundColor;
+ this.ctx.strokeStyle = this.rainColor;
+ },
draw: function() {
- if (Math.random() > 0.3) {
+ if (Math.random() <= this.intensity) {
this.drops[this.drop_c].start(this.w, this.h, this.perspective);
this.drop_c = (this.drop_c + 1) % 100;
}