| Index: screensavers/horizontal_sparkle/index.htm
|
| diff --git a/screensavers/horizontal_sparkle/index.htm b/screensavers/horizontal_sparkle/index.htm
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..50680fcecc6abab33d81a0a351fe7622f0b25d63
|
| --- /dev/null
|
| +++ b/screensavers/horizontal_sparkle/index.htm
|
| @@ -0,0 +1,156 @@
|
| +<html>
|
| +<head>
|
| +<script type="text/javascript">
|
| +var canvas;
|
| +var g;
|
| +var rate = 5;
|
| +var mouseX = 0;
|
| +var mouseY = 0;
|
| +var pmouseX = 0;
|
| +var pmouseY = 0;
|
| +var width, height;
|
| +var mousePressed = false;
|
| +
|
| +var hexes = [];
|
| +
|
| +function setup() {
|
| + canvas = document.createElement("canvas");
|
| + document.body.appendChild(canvas);
|
| + g = canvas.getContext("2d");
|
| + setInterval(draw, rate);
|
| + document.addEventListener('mousemove', onDocumentMouseMove, false);
|
| + document.addEventListener('mousedown', onDocumentMouseDown, false);
|
| + document.addEventListener('mouseup', onDocumentMouseUp, false);
|
| + window.addEventListener('resize', onWindowResize, false);
|
| + onWindowResize();
|
| + //////////////////////////////////////////
|
| + while (hexes.length < 200) {
|
| + hexes.push(new Hex());
|
| + }
|
| +}
|
| +function onWindowResize(e) {
|
| + width = canvas.width = window.innerWidth;
|
| + height = canvas.height = window.innerHeight;
|
| +}
|
| +function onDocumentMouseMove(e) {
|
| + pmouseX = mouseX;
|
| + pmouseY = mouseY;
|
| + mouseX = e.pageX;
|
| + mouseY = e.pageY;
|
| +}
|
| +function onDocumentMouseDown(e) {
|
| + mousePressed = true;
|
| +}
|
| +function onDocumentMouseUp(e) {
|
| + mousePressed = false;
|
| +}
|
| +
|
| +function dist(x, y, xx, yy) {
|
| + return Math.sqrt((xx-x)*(xx-x)+(yy-y)*(yy-y));
|
| +}
|
| +
|
| +function constrain(v, min, max){
|
| + if(v<min) v = min;
|
| + if(v>max) v = max;
|
| + return v;
|
| +}
|
| +
|
| +function map(v, i1, i2, o1, o2) {
|
| + return o1 + (o2 - o1) * ((v - i1) / (i2 - i1));
|
| +}
|
| +
|
| +function random(a, b) {
|
| + var r = Math.random();
|
| + if (a instanceof Array) {
|
| + var i = Math.floor(r*a.length);
|
| + return a[i];
|
| + } else if (b == undefined) {
|
| + return r*a;
|
| + } else {
|
| + return r*(a+b)-a;
|
| + }
|
| +}
|
| +var cx = -200;
|
| +function draw() {
|
| + g.globalCompositeOperation = "source-over";
|
| + g.fillStyle= "#000";
|
| + g.fillRect(0, 0, width, height);
|
| + g.globalCompositeOperation = "lighter";
|
| + for (var h in hexes) {
|
| + hexes[h].update();
|
| + hexes[h].draw();
|
| + }
|
| + cx += 8;
|
| + if (cx > width+200) {
|
| + cx = -200;
|
| + }
|
| +}
|
| +
|
| +function roundedHex(x,y, d) {
|
| + var sides = 6;
|
| + var a = Math.PI*2/sides;
|
| + var aa = a;
|
| + var r = 10;
|
| + g.beginPath();
|
| + g.save();
|
| + g.translate(x, y);
|
| + g.moveTo(Math.cos(aa)*d, Math.sin(aa)*d);
|
| + for (var i = 0; i < sides; i++) {
|
| + aa += a;
|
| + g.lineTo(Math.cos(aa)*d, Math.sin(aa)*d);
|
| + }
|
| + g.fill();
|
| + g.restore();
|
| + g.closePath();
|
| +}
|
| +
|
| +var colors = ["#e4463b", "#fffc23", "#5ad81c", "#1c8bd8"];
|
| +var s = 80;
|
| +var rows = 20;
|
| +var cols = 10;
|
| +function Hex() {
|
| + this.x = (hexes.length%rows)*s;
|
| + this.y = Math.floor(hexes.length/rows)*s*0.865;
|
| + this.color = random(colors);
|
| + this.ss = 0;
|
| + this.draw = function() {
|
| + var radgrad2 = g.createRadialGradient(0,0,0,0,0,this.ss*1.5);//g.createRadialGradient(this.x,this.y,0,this.x,this.y,this.s);
|
| + radgrad2.addColorStop(0, this.color);
|
| + radgrad2.addColorStop(1, "#000");
|
| + g.fillStyle = radgrad2;
|
| + if (this.ss > 0) {
|
| + roundedHex(this.x, this.y, this.ss);
|
| + }
|
| + }
|
| +
|
| + this.update = function() {
|
| + var d = dist(cx, height/2.3, this.x, this.y);
|
| + d = constrain(d, 0, 200);
|
| + var x = map(d, 200, 0, 0, s*2);
|
| + this.ss += (x-this.ss)*0.5;
|
| + }
|
| +
|
| +}
|
| +</script>
|
| +<style type="text/css">
|
| +* {
|
| +margin: 0;
|
| +padding: 0;
|
| +}
|
| +html, body {
|
| +width: 100%;
|
| +background-color: #000;
|
| +height: 100%;
|
| +}
|
| +img {
|
| +position: absolute;
|
| + left: 50%;
|
| + margin-left: -90px;
|
| + padding-top: 470px;
|
| +}
|
| +</style>
|
| +</head>
|
| +<body onload="setup()">
|
| +<img src="title.png" alt="" width="180"/>
|
| +</body>
|
| +</html>
|
|
|
Chromium Code Reviews
Issue 5558004:
Move screensavers over from assets to chromiumos-assets as they are ChromiumOS specific atm. (Closed)
Base URL: http://git.chromium.org/git/chromiumos-assets.git@master