Smaller logo.
1 var QUOTES_NUMBER = 39;
3 var SERVER = "http://" + window.location.hostname + ":" + port;
5 $(document).ready(function() {
6 var image = new Image();
7 image.onload = init_logo;
8 image.src = "images/logobase.png";
9 $("#logo").click(handle_click);
10 $("#logo").hover(function() {
11 $(this).css("cursor", "pointer");
13 $(this).css("cursor", "auto");
17 $(document).keypress( function(event) {
18 if (event.which == 13) {
19 event.preventDefault();
25 var menu_height = 100;
26 var menu_splits = new Array(180, 350, 505);
28 var click_events = new Array();
29 click_events["logo"] = new Array();
30 click_events["logo"][0] = new Object();
31 click_events["logo"][0]["min_x"] = 0;
32 click_events["logo"][0]["max_x"] = menu_splits[0];
33 click_events["logo"][0]["min_y"] = 0;
34 click_events["logo"][0]["max_y"] = menu_height;
35 click_events["logo"][0]["func"] = switch_page;
36 click_events["logo"][0]["args"] = new Array("personalwork.html");
37 click_events["logo"][1] = new Object();
38 click_events["logo"][1]["min_x"] = menu_splits[0] + 1;
39 click_events["logo"][1]["max_x"] = menu_splits[1];
40 click_events["logo"][1]["min_y"] = 0;
41 click_events["logo"][1]["max_y"] = menu_height;
42 click_events["logo"][1]["func"] = switch_page;
43 click_events["logo"][1]["args"] = new Array("howiwork.html");
44 click_events["logo"][2] = new Object();
45 click_events["logo"][2]["min_x"] = menu_splits[1] + 1;
46 click_events["logo"][2]["max_x"] = menu_splits[2];
47 click_events["logo"][2]["min_y"] = 0;
48 click_events["logo"][2]["max_y"] = menu_height;
49 click_events["logo"][2]["func"] = switch_page;
50 click_events["logo"][2]["args"] = new Array("books.html");
51 click_events["logo"][3] = new Object();
52 click_events["logo"][3]["min_x"] = menu_splits[2] + 1;
53 click_events["logo"][3]["max_x"] = menu_width - 1;
54 click_events["logo"][3]["min_y"] = 0;
55 click_events["logo"][3]["max_y"] = menu_height;
56 click_events["logo"][3]["func"] = switch_page;
57 click_events["logo"][3]["args"] = new Array("links.html", "linksend.html");
59 function mouse_pos(event) {
60 var offset = $("#logo").offset();
61 return new Array(event.pageX - offset.left,
62 event.pageY - offset.top);
65 function handle_click(event) {
66 var xy = mouse_pos(event);
69 for (var i in click_events[event.target.id]) {
70 var ces = click_events[event.target.id][i];
71 if (ces && x >= ces["min_x"] && x <= ces["max_x"]
72 && y >= ces["min_y"] && y <= ces["max_y"]) {
73 ces["func"](event.target.id, ces);
79 function switch_page(id, params) {
80 var page = params["args"][0];
82 document.location.href = page;
85 function colour_area(image, min_x, max_x, min_y, max_y, colour) {
86 var pixels = image.data;
87 for (var y = min_y; y <= max_y; y += 1) {
88 for (var x = min_x; x <= max_x; x += 1) {
89 var pix_colour = getPixel(image, x, y);
90 if (pix_colour.a > 0) {
91 colour.a = pix_colour.a;
92 setPixel(image, x, y, colour);
98 function init_logo(event) {
99 var canvas = document.getElementById("logo");
100 var context = canvas.getContext("2d");
101 canvas.width = menu_width;
102 canvas.height = menu_height;
103 context.drawImage(event.target, 0, 0);
104 var image = context.getImageData(0, 0, menu_width, menu_height);
105 var white = new Colour(255, 255, 255);
106 var black = new Colour(0, 0, 0);
107 var orange = new Colour(201, 87, 35);
108 var green = new Colour(90, 215, 21);
110 for (var i in click_events["logo"]) {
111 var p = click_events["logo"][i];
112 var min_x = p["min_x"];
113 var max_x = p["max_x"];
114 var min_y = p["min_y"];
115 var max_y = p["max_y"];
116 var pos = document.location.href.lastIndexOf("/") + 1;
117 var page = document.location.href.substr(pos);
118 for (var j in p["args"]) {
119 if (page == p["args"][j]) {
120 colour_area(image, min_x, max_x, 0, 60, orange);
121 colour_area(image, min_x, max_x, 60, max_y, white);
127 colour_area(image, min_x, max_x, 0, 60, white);
128 colour_area(image, min_x, max_x, 60, max_y, orange);
131 context.putImageData(image, 0, 0);
132 // context.fillStyle = green.str();
133 // console.log((found["max_x"] - found["min_x"]) / 2 + found["min_x"] - 2);
134 // context.fillRect((found["max_x"]-found["min_x"])/2+found["min_x"]-1, 95, 2, 5);
138 function drawMenuLines() {
139 var canvas = document.getElementById("logo");
140 var context = canvas.getContext("2d");
141 var image = context.getImageData(0, 0, menu_width, menu_height);
142 var pixels = image.data;
143 context.lineCap = "round";
144 context.lineWidth = 1;
145 var colour1a = new Colour(0, 0, 0, 0.1);
147 context.moveTo(0, menu_height - 1);
148 context.lineTo(menu_width - 1, menu_height - 1);
150 context.strokeStyle = colour1a.str();
152 var colour1e = new Colour(0, 0, 0, 0.05);
154 context.moveTo(70, menu_height - 1);
155 context.lineTo(menu_width - 71, menu_height - 1);
157 context.strokeStyle = colour1e.str();
159 var colour1b = new Colour(0, 0, 0, 0.05);
161 context.moveTo(50, menu_height - 1);
162 context.lineTo(menu_width - 51, menu_height - 1);
164 context.strokeStyle = colour1b.str();
166 var colour1c = new Colour(0, 0, 0, 0.05);
168 context.moveTo(25, menu_height - 1);
169 context.lineTo(menu_width - 26, menu_height - 1);
171 context.strokeStyle = colour1c.str();
173 var colour1d = new Colour(0, 0, 0, 0.05);
175 context.moveTo(10, menu_height - 1);
176 context.lineTo(menu_width - 11, menu_height - 1);
178 context.strokeStyle = colour1d.str();
181 var colour2 = new Colour(0, 0, 0, 0.2);
183 context.moveTo(menu_splits[0], 0);
184 context.lineTo(menu_splits[0], menu_height - 1);
185 context.moveTo(menu_splits[1], 0);
186 context.lineTo(menu_splits[1], menu_height - 1);
187 context.moveTo(menu_splits[2], 0);
188 context.lineTo(menu_splits[2], menu_height - 1);
190 context.strokeStyle = colour2.str();
193 context.clearRect(menu_splits[0] - 1, menu_height - 1, 2, 2);
194 context.clearRect(menu_splits[1] - 1, menu_height - 1, 2, 2);
195 context.clearRect(menu_splits[2] - 1, menu_height - 1, 2, 2);
197 context.clearRect(menu_splits[0] - 1, menu_height - 2, 1, 1);
198 context.clearRect(menu_splits[1] - 1, menu_height - 2, 1, 1);
199 context.clearRect(menu_splits[2] - 1, menu_height - 2, 1, 1);
202 function clearMenuLines() {
203 var canvas = document.getElementById("logo");
204 var context = canvas.getContext("2d");
205 var image = context.getImageData(0, 0, menu_width, menu_height);
206 var pixels = image.data;
207 context.clearRect(0, menu_height - 2, menu_width - 1, 2);
208 context.clearRect(menu_splits[0] - 1, 0, 2, menu_height - 1);
209 context.clearRect(menu_splits[1] - 1, 0, 2, menu_height - 1);
210 context.clearRect(menu_splits[2] - 1, 0, 2, menu_height - 1);
213 function update_logo() {
214 var canvas = document.getElementById("logo");
215 var context = canvas.getContext("2d");
216 var image = context.getImageData(0, 0, menu_width, menu_height);
217 var pixels = image.data;
218 var white = new Colour(255, 255, 255);
219 for (var y = 0; y < menu_height; y += 1) {
220 for (var x = 0; x < menu_width; x += 1) {
221 var pix_colour = getPixel(image, x, y);
222 if (pix_colour.a > 0) {
223 setPixel(image, x, y, new Colour(90, 215, 21, pix_colour.a));
227 context.putImageData(image, 0, 0);
230 function Colour(r, g, b, a) {
234 this.a = a == undefined ? 255 : a;
236 Colour.prototype.equals = function(rhs) {
238 if (typeof(rhs[p]) == undefined
239 || this[p] != rhs[p]) {
245 Colour.prototype.str = function() {
246 return "rgba(" + this.r + "," + this.g + "," + this.b + "," + this.a + ")";
249 function setPixel(image, x, y, colour) {
250 var index = 4 * (x + y * image.width);
251 image.data[index] = colour.r;
252 image.data[index + 1] = colour.g;
253 image.data[index + 2] = colour.b;
254 image.data[index + 3] = colour.a;
257 function getPixel(image, x, y) {
258 var index = 4 * (x + y * image.width);
259 var r = image.data[index];
260 var g = image.data[index + 1];
261 var b = image.data[index + 2];
262 var a = image.data[index + 3];
263 return new Colour(r, g, b, a);
266 function load_random_quote() {
267 var file = "/quotes/quote" + Math.floor(Math.random() * QUOTES_NUMBER + 1) + ".html";
268 $.ajax({url: SERVER + file,
269 success: write_quote});
272 function write_quote(data, status, xhr) {
273 $("#random_quote").html(data);
276 function load_footer()
278 var file = "/footer.html";
279 var currentFile = self.location.hostname + self.location.pathname;
280 var request = http_request_object();
281 var url = "http://" + self.location.hostname + file;
282 request.open("GET", url, false);
283 request.setRequestHeader("User-Agent", navigator.userAgent);
285 // if (oRequest.status == 200) alert(oRequest.responseText);
286 // else alert("Error executing XMLHttpRequest call!");
287 //document.write(url);
288 //document.write(request.responseText);
289 document.getElementById('footer').innerHTML = request.responseText;
294 // Mandelbrot functions
295 function Complex(real, imag)
301 var MIN_C = new Complex(-2.2, -1.4);
302 var MAX_C = new Complex(1.0, 1.4);
306 var max_iter = MIN_ITER;
311 function Result(z, iter)
317 function complex_quad(c)
319 return new Complex(Math.pow(c.real, 2) - Math.pow(c.imag, 2),
320 2.0 * c.real * c.imag);
323 function complex_quad_value(c)
325 return Math.pow(c.real, 2) + Math.pow(c.imag, 2);
328 function complex_add(c1, c2)
330 return new Complex(c1.real + c2.real, c1.imag + c2.imag);
333 function complex_equal(c1, c2)
335 return (c1.real == c2.real) && (c1.imag == c2.imag);
338 function iterate(z, c)
340 z_quad = complex_quad(z);
341 return new Complex(z_quad.real + c.real, z_quad.imag + c.imag);
344 function test(c, max_iter)
347 var z = new Complex(0.0, 0.0);
348 var last_z = new Complex(-1.0, 0.0);
349 var quad_z = complex_quad_value(z);
351 while (iter < max_iter
352 && !complex_equal(z, last_z)
353 && quad_z <= bailout)
357 quad_z = complex_quad_value(z);
360 return new Result(quad_z, iter);
363 function draw(diter, dx, dy, dz, dres)
365 var canvas = document.getElementById('mandelbrot');
367 if (canvas.getContext)
370 var ctx = canvas.getContext('2d');
374 resolution = Math.max(1, resolution + dres);
379 max_iter = Math.max(MIN_ITER, max_iter + diter);
382 var red = "rgb(255, 0, 0)";
383 var white = "rgb(255, 255, 255)";
384 var width = canvas.width;
385 var height = canvas.height;
386 var dim = Math.max(width, height);
387 var dim_ratio = Math.round(width / height);
388 var diff_c = new Complex(max_c.real - min_c.real,
389 max_c.imag - min_c.imag);
390 dx_min = diff_c.real / 100 * (dx + dz);
391 dx_max = diff_c.real / 100 * (dx - dz);
393 dy_min = diff_c.imag / 100 * (dy + dz);
394 dy_max = diff_c.imag / 100 * (dy - dz);
396 var min_inc = new Complex(dx_min * dim_ratio / 2.0, dy_min);
397 var max_inc = new Complex(dx_max * dim_ratio / 2.0, dy_max);
398 min_c = complex_add(min_c, min_inc);
399 max_c = complex_add(max_c, max_inc);
400 diff_c = new Complex(max_c.real - min_c.real,
401 max_c.imag - min_c.imag);
403 for (var y = 0; y < height; y += resolution)
405 for (var x = 0; x < width; x += resolution)
407 var c = new Complex(min_c.real + diff_c.real / dim * x,
408 min_c.imag + diff_c.imag / dim * y);
409 var result = test(c, max_iter);
410 var r = Math.min(255, Math.pow(Math.max(0,
411 (result.iter - max_iter / 20.0)), 2));
412 var g = Math.min(255, Math.pow(Math.max(0,
413 (result.iter - max_iter / 25.0)), 2));
414 var b = Math.min(255, Math.pow(Math.max(0,
415 (result.iter - max_iter / 20.0)), 2));
416 var colour = "rgb(" + r + "," + g + "," + b + ")";
417 ctx.fillStyle = colour;
418 ctx.fillRect(x, y, resolution, resolution);
424 function getEventOffsetX(evt)
426 if (evt.offsetX != null)
429 var obj = evt.target || evt.srcElement;
431 return (evt.clientX - obj.pageLeft);
434 function getEventOffsetY(evt)
436 if (evt.offsetY != null)
439 var obj = evt.target || evt.srcElement;
441 return (evt.clientY - obj.pageTop);
444 function setPageTopLeft( o )
450 while (o.offsetParent)
452 left += o.offsetLeft ;
465 var x = (getEventOffsetX(evt) - 335) / 167.5;
466 var y = (getEventOffsetY(evt) - 140) / 70;
468 draw(iter, x, y, z, res);