Permalink
Find file
Fetching contributors…
Cannot retrieve contributors at this time
executable file 209 lines (173 sloc) 5.21 KB
<html>
<head>
<title>nice</title>
<link rel="stylesheet" href="style.css" TYPE="text/css">
<script>
var sessionToken = '';
var checkDelay = 1000;
var started = false;
var symbols = [
//USD/JPY, GBP/USD, AUD/USD, USD/CHF
{ key: "EUR/USD", data: null, x_start: 180, y_start: 100, scale: -1, color: [0, 1, 81, 103]}, // default blue color: 0, 1, 81, 103
{ key: "USD/CAD", data: null, x_start: 130, y_start: 360, scale: 1, color: [81, 1, 0, 103]},
{ key: "USD/CHF", data: null, x_start: 500, y_start: 300, scale: 1, color: [255, 255, 10, 103]},
{ key: "GBP/USD", data: null, x_start: 800, y_start: 100, scale: -1, color: [1, 130, 200, 103]},
{ key: "AUD/USD", data: null, x_start: 800, y_start: 360, scale: -1, color: [10, 100, 10, 103]}
];
</script>
</head>
<body>
<div id="wrapper">
<div id="prompt" style="display:none">
</div>
<div id="splash" style="text-align:center;">
<h1>CASH $OUP, WTF! (World - Trading - Financials)</h1>
<h2>Loading ... <span id="splashstatus"></span></h2>
<img src="soup.gif" alt="soup" id="splashimage" style="opacity: 0.2" />
</div>
<div id="main" style="display:none">
<script type="application/processing">
// Global variables
int NUM = symbols.length;
Spore SPORES = new Spore[NUM];
int DELAY = 70;
float SCALE;
float SCALE_MIN = 99999.0;
float SCALE_MAX = 0.0;
float RADIUS_MIN = 20.0;
float RADIUS_MAX = 200.0;
float mod(float x, float m) {
x = x % m;
return x > 0 ? x : m + x;
}
class Spore {
float R, nR; // current/new radius
float B, nB; // current/new border margin
int X, Y; // current location
int nX, nY; // new location
Object symbol;
int c1, c2, c3, c4;
color myRadiusColor;
int scale;
float ask; //tmp radius
Spore(Object key) {
symbol = key;
scale = symbol.scale;
c1 = symbol.color[0];
c2 = symbol.color[1];
c3 = symbol.color[2];
c4 = symbol.color[3];
X = symbol.x_start;
Y = symbol.y_start;
myRadiusColor = color(253, 253, 253, 99);
R = 0.0;
nR = R;
B = 7.0;
nB = B;
nX = 10*int(random(-2,2)); // X
nY = 10*int(random(-2,2)); // Y
}
// Test to see if mouse is over this spring
boolean over() {
float disX = X - mouseX+200; // WTF ? why offset by 200? Something in the dom is causing this offset requirement - KV
float disY = Y - mouseY;
if (sqrt(sq(disX) + sq(disY)) < (R+B)/2 ) {
return true;
} else {
return false;
}
}
void draw() {
setRadius(RADIUS_MIN + (ask-SCALE_MIN)/(SCALE_MAX-SCALE_MIN)*(RADIUS_MAX-RADIUS_MIN));
R += (nR-R)/DELAY;
B += (nB-B)/DELAY;
// Track circle to new destination
//X += (nX-X)/DELAY;
//Y += (nY-Y)/DELAY;
X += nX/DELAY;
Y += nY/DELAY;
// Draw circle
fill(myRadiusColor); // outer (white)
X = mod(X, width);
Y = mod(Y,height);
ellipse( X, Y, R+B, R+B );
fill(c1, c2, c3, over() ? 240 : c4); // inner (blue)
ellipse( X, Y, R, R );
if (over()) {
// display the hover text
fill(255,255,255,160);
rect(X+50, Y-20, 45, 20);
fill(0,0,0,200);
PFont font = loadFont("FFScala-32.vlw");
textFont(font);
text(symbol.key, X+18, Y-10);
}
}
void update() {
if(symbol.data) {
ask = symbol.data.ask;
ask = scale > 0 ? ask : 1.0 / ask;
SCALE_MIN = min(SCALE_MIN, ask);
SCALE_MAX = max(SCALE_MAX, ask);
}
}
// move towards (x,y)
void move(int x, int y) {
nX = x;
nY = y;
}
void setRadius(float r) {
nR = max(r, 0.0);
}
void setBorder(float b) {
nB = max(b, 0.0);
}
}
// Setup the Processing Canvas
void setup(){
rectMode(CENTER_RADIUS);
size( 1000, 500 );
noStroke();
frameRate( 30 );
for(int i=0; i<NUM; i++) {
SPORES[i] = new Spore(symbols[i]);
}
}
// Main draw loop
void draw(){
// Fill canvas grey
background( 100 );
for(int i=0; i<NUM; i++) {
SPORES[i].update();
}
for(int i=0; i<NUM; i++) {
SPORES[i].draw();
}
}
</script>
<canvas width='1000' height='500'></canvas>
<table id="datatable">
<thead>
<tr>
<th>KEY</th>
<th>ASK</th>
</tr>
</thead>
<tbody>
<script>
for (var i=0; i< symbols.length; i++) {
var symbol = symbols[i];
document.write('<tr data-symbol="'+symbol.key+'"><td style="background: rgba('+symbol.color[0]+','+symbol.color[1]+','+symbol.color[2]+',0.5)">'+symbol.key+'</td><td class="ask">--</td></tr>');
}
</script>
</tbody>
</table>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="fxtrade.js"></script>
<script type="text/javascript" src="fux.js"></script>
<script language="javascript" src="processing.init.js"></script>
<script language="javascript" src="processing.js"></script>
</body>
</html>