factory/v2012/script.js
author Eugen Sawin <sawine@me73.com>
Sun, 18 Dec 2011 03:36:00 +0100
changeset 72 c78f182f7412
child 74 c0e6fb6cf6ef
permissions -rw-r--r--
Initial version of 2012 menu.
sawine@72
     1
var QUOTES_NUMBER = 39;
sawine@72
     2
var SERVER = "http://me73.com"
sawine@72
     3
sawine@72
     4
$(document).ready(function() {     
sawine@72
     5
    var image = new Image();
sawine@72
     6
    image.onload = init_logo;
sawine@72
     7
    image.src = "images/logobase.png";
sawine@72
     8
    $("#logo").click(handle_click);   
sawine@72
     9
    $("#logo").hover(function() {
sawine@72
    10
        $(this).css("cursor", "pointer");
sawine@72
    11
    }, function() {
sawine@72
    12
        $(this).css("cursor", "auto");
sawine@72
    13
    }); 
sawine@72
    14
});
sawine@72
    15
sawine@72
    16
$(document).keypress( function(event) {
sawine@72
    17
    if (event.which == 13) {            
sawine@72
    18
	event.preventDefault();
sawine@72
    19
        update_logo();	    
sawine@72
    20
    }
sawine@72
    21
});
sawine@72
    22
sawine@72
    23
var menu_width = 670;
sawine@72
    24
var menu_height = 120;
sawine@72
    25
sawine@72
    26
var click_events = new Array();
sawine@72
    27
click_events["logo"] = new Array();
sawine@72
    28
click_events["logo"][0] = new Object();
sawine@72
    29
click_events["logo"][0]["min_x"] = 0;
sawine@72
    30
click_events["logo"][0]["max_x"] = Math.round(menu_width/4);
sawine@72
    31
click_events["logo"][0]["min_y"] = 0;
sawine@72
    32
click_events["logo"][0]["max_y"] = menu_height;
sawine@72
    33
click_events["logo"][0]["func"] = switch_page;
sawine@72
    34
click_events["logo"][0]["args"] = "personalwork.html";
sawine@72
    35
click_events["logo"][1] = new Object();
sawine@72
    36
click_events["logo"][1]["min_x"] = Math.round(menu_width/4) + 1;
sawine@72
    37
click_events["logo"][1]["max_x"] = Math.round(menu_width/2);
sawine@72
    38
click_events["logo"][1]["min_y"] = 0;
sawine@72
    39
click_events["logo"][1]["max_y"] = menu_height;
sawine@72
    40
click_events["logo"][1]["func"] = switch_page;
sawine@72
    41
click_events["logo"][1]["args"] = "howiwork.html";
sawine@72
    42
click_events["logo"][2] = new Object();
sawine@72
    43
click_events["logo"][2]["min_x"] = Math.round(menu_width/2) + 1;
sawine@72
    44
click_events["logo"][2]["max_x"] = Math.round(menu_width/4*3);
sawine@72
    45
click_events["logo"][2]["min_y"] = 0;
sawine@72
    46
click_events["logo"][2]["max_y"] = menu_height;
sawine@72
    47
click_events["logo"][2]["func"] = switch_page;
sawine@72
    48
click_events["logo"][2]["args"] = "books.html";
sawine@72
    49
click_events["logo"][3] = new Object();
sawine@72
    50
click_events["logo"][3]["min_x"] = Math.round(menu_width/4*3) + 1;
sawine@72
    51
click_events["logo"][3]["max_x"] = menu_width - 1;
sawine@72
    52
click_events["logo"][3]["min_y"] = 0;
sawine@72
    53
click_events["logo"][3]["max_y"] = menu_height;
sawine@72
    54
click_events["logo"][3]["func"] = switch_page;
sawine@72
    55
click_events["logo"][3]["args"] = "links.html";
sawine@72
    56
sawine@72
    57
function handle_click(e) {
sawine@72
    58
    var offset = $("#logo").offset();
sawine@72
    59
    var x = e.pageX - offset.left;
sawine@72
    60
    var y = e.pageY - offset.top;   
sawine@72
    61
    for (var i in click_events[e.target.id]) {
sawine@72
    62
        var ces = click_events[e.target.id][i];
sawine@72
    63
        if (ces && x >= ces["min_x"] && x <= ces["max_x"]
sawine@72
    64
            && y >= ces["min_y"] && y <= ces["max_y"]) {    
sawine@72
    65
            ces["func"](e.target.id, ces);
sawine@72
    66
            break;
sawine@72
    67
        }
sawine@72
    68
    }
sawine@72
    69
}
sawine@72
    70
sawine@72
    71
function switch_page(id, params) {
sawine@72
    72
    var page = params["args"];
sawine@72
    73
    $("body").load(page);
sawine@72
    74
    document.location.href = page;    
sawine@72
    75
}
sawine@72
    76
sawine@72
    77
function color_area(id, min_x, max_x, min_y, max_y, colour) {
sawine@72
    78
    var canvas = document.getElementById(id);
sawine@72
    79
    var context = canvas.getContext("2d");  
sawine@72
    80
    var image = context.getImageData(0, 0, menu_width, menu_height);
sawine@72
    81
    var pixels = image.data;    
sawine@72
    82
    for (var y = min_y; y <= max_y; y += 1) {
sawine@72
    83
        for (var x = min_x; x <= max_x; x += 1) {
sawine@72
    84
            var pix_colour = getPixel(image, x, y);
sawine@72
    85
            if (pix_colour.a > 0) {
sawine@72
    86
                colour.a = pix_colour.a;
sawine@72
    87
                setPixel(image, x, y, colour);
sawine@72
    88
            }
sawine@72
    89
        }
sawine@72
    90
    }   
sawine@72
    91
    context.putImageData(image, 0, 0);
sawine@72
    92
}
sawine@72
    93
sawine@72
    94
function init_logo(event) {
sawine@72
    95
    var canvas = document.getElementById("logo");
sawine@72
    96
    var context = canvas.getContext("2d"); 
sawine@72
    97
    var image = context.getImageData(0, 0, menu_width, menu_height);  
sawine@72
    98
    canvas.width = menu_width;
sawine@72
    99
    canvas.height = menu_height;
sawine@72
   100
    context.drawImage(event.target, 0, 0);
sawine@72
   101
    var white = new Colour(255, 255, 255);
sawine@72
   102
    for (var i in click_events["logo"]) {
sawine@72
   103
        var p = click_events["logo"][i];        
sawine@72
   104
        var pos = document.location.href.lastIndexOf("/") + 1;       
sawine@72
   105
        if (p["args"] == document.location.href.substr(pos)) {         
sawine@72
   106
            color_area("logo", p["min_x"], p["max_x"], 70, p["max_y"], white);           
sawine@72
   107
        } else {
sawine@72
   108
            color_area("logo", p["min_x"], p["max_x"], 0, 70, white);
sawine@72
   109
        }
sawine@72
   110
    }
sawine@72
   111
}
sawine@72
   112
sawine@72
   113
function update_logo() {
sawine@72
   114
    var canvas = document.getElementById("logo");
sawine@72
   115
    var context = canvas.getContext("2d");  
sawine@72
   116
    var image = context.getImageData(0, 0, menu_width, menu_height);
sawine@72
   117
    var pixels = image.data;
sawine@72
   118
    var white = new Colour(255, 255, 255);
sawine@72
   119
    for (var y = 0; y < menu_height; y += 1) {
sawine@72
   120
        for (var x = 0; x < menu_width; x += 1) {
sawine@72
   121
            var pix_colour = getPixel(image, x, y);
sawine@72
   122
            if (pix_colour.a > 0) {
sawine@72
   123
                setPixel(image, x, y, new Colour(90, 215, 21, pix_colour.a));
sawine@72
   124
            }
sawine@72
   125
        }
sawine@72
   126
    }   
sawine@72
   127
    context.putImageData(image, 0, 0);
sawine@72
   128
}
sawine@72
   129
sawine@72
   130
function Colour(r, g, b, a) {
sawine@72
   131
    this.r = r;
sawine@72
   132
    this.g = g;
sawine@72
   133
    this.b = b;
sawine@72
   134
    this.a = a == undefined ? 255 : a;
sawine@72
   135
}
sawine@72
   136
Colour.prototype.equals = function(rhs) {
sawine@72
   137
    for (p in this) {
sawine@72
   138
        if (typeof(rhs[p]) == undefined
sawine@72
   139
           || this[p] != rhs[p]) {           
sawine@72
   140
            return false;
sawine@72
   141
        }
sawine@72
   142
    }
sawine@72
   143
    return true;
sawine@72
   144
}
sawine@72
   145
sawine@72
   146
function setPixel(image, x, y, color) {
sawine@72
   147
    var index = 4 * (x + y * image.width);
sawine@72
   148
    image.data[index] = color.r;
sawine@72
   149
    image.data[index + 1] = color.g;
sawine@72
   150
    image.data[index + 2] = color.b;
sawine@72
   151
    image.data[index + 3] = color.a;
sawine@72
   152
}
sawine@72
   153
sawine@72
   154
function getPixel(image, x, y) {   
sawine@72
   155
    var index = 4 * (x + y * image.width);
sawine@72
   156
    var r = image.data[index];
sawine@72
   157
    var g = image.data[index + 1];
sawine@72
   158
    var b = image.data[index + 2];
sawine@72
   159
    var a = image.data[index + 3];
sawine@72
   160
    return new Colour(r, g, b, a);
sawine@72
   161
}
sawine@72
   162
sawine@72
   163
function load_random_quote() {
sawine@72
   164
    var file = "/quotes/quote" + Math.floor(Math.random() * QUOTES_NUMBER + 1) + ".html";
sawine@72
   165
    $.ajax({url: SERVER + file,
sawine@72
   166
            success: write_quote});   
sawine@72
   167
    return;
sawine@72
   168
    var currentFile = self.location.hostname + self.location.pathname;		
sawine@72
   169
    var request = http_request_object();
sawine@72
   170
    var url  = "http://" + self.location.hostname + file;	
sawine@72
   171
    request.open("GET", url, false);
sawine@72
   172
    request.setRequestHeader("User-Agent", navigator.userAgent);
sawine@72
   173
    request.send(null)
sawine@72
   174
    
sawine@72
   175
    // if (oRequest.status == 200) alert(oRequest.responseText);
sawine@72
   176
    // else alert("Error executing XMLHttpRequest call!");	
sawine@72
   177
    //document.write(url);
sawine@72
   178
    //document.write(request.responseText);
sawine@72
   179
    document.getElementById('random_quote').innerHTML = request.responseText;
sawine@72
   180
}
sawine@72
   181
sawine@72
   182
function write_quote(data, status, xhr) {
sawine@72
   183
    alert(data);
sawine@72
   184
    $("random_quote").replaceWith(data);
sawine@72
   185
}
sawine@72
   186
sawine@72
   187
function load_footer()
sawine@72
   188
{
sawine@72
   189
	var file = "/footer.html";
sawine@72
   190
	var currentFile = self.location.hostname + self.location.pathname;		
sawine@72
   191
	var request = http_request_object();
sawine@72
   192
	var url  = "http://" + self.location.hostname + file;	
sawine@72
   193
	request.open("GET", url, false);
sawine@72
   194
	request.setRequestHeader("User-Agent", navigator.userAgent);
sawine@72
   195
	request.send(null)
sawine@72
   196
	// if (oRequest.status == 200) alert(oRequest.responseText);
sawine@72
   197
	// else alert("Error executing XMLHttpRequest call!");	
sawine@72
   198
	//document.write(url);
sawine@72
   199
	//document.write(request.responseText);
sawine@72
   200
    document.getElementById('footer').innerHTML = request.responseText;
sawine@72
   201
}
sawine@72
   202
sawine@72
   203
sawine@72
   204
sawine@72
   205
// Mandelbrot functions
sawine@72
   206
function Complex(real, imag) 
sawine@72
   207
{
sawine@72
   208
	this.real = real;
sawine@72
   209
	this.imag = imag;
sawine@72
   210
}
sawine@72
   211
sawine@72
   212
var MIN_C = new Complex(-2.2, -1.4);
sawine@72
   213
var MAX_C = new Complex(1.0, 1.4);
sawine@72
   214
var min_c = MIN_C;
sawine@72
   215
var max_c = MAX_C;
sawine@72
   216
var MIN_ITER = 100;
sawine@72
   217
var max_iter = MIN_ITER;
sawine@72
   218
var zoom = 1.0;
sawine@72
   219
var resolution = 3;
sawine@72
   220
var bailout = 4.0;
sawine@72
   221
sawine@72
   222
function Result(z, iter) 
sawine@72
   223
{
sawine@72
   224
	this.z = z;
sawine@72
   225
	this.iter = iter;
sawine@72
   226
}
sawine@72
   227
sawine@72
   228
function complex_quad(c)
sawine@72
   229
{
sawine@72
   230
	return new Complex(Math.pow(c.real, 2) - Math.pow(c.imag, 2), 
sawine@72
   231
		2.0 * c.real * c.imag);
sawine@72
   232
}
sawine@72
   233
sawine@72
   234
function complex_quad_value(c)
sawine@72
   235
{
sawine@72
   236
	return Math.pow(c.real, 2) + Math.pow(c.imag, 2);
sawine@72
   237
}
sawine@72
   238
sawine@72
   239
function complex_add(c1, c2)
sawine@72
   240
{
sawine@72
   241
	return new Complex(c1.real + c2.real, c1.imag + c2.imag);
sawine@72
   242
}
sawine@72
   243
sawine@72
   244
function complex_equal(c1, c2)
sawine@72
   245
{	
sawine@72
   246
	return (c1.real == c2.real) && (c1.imag == c2.imag);
sawine@72
   247
}
sawine@72
   248
sawine@72
   249
function iterate(z, c) 
sawine@72
   250
{
sawine@72
   251
	z_quad = complex_quad(z);
sawine@72
   252
	return new Complex(z_quad.real + c.real, z_quad.imag + c.imag);
sawine@72
   253
}
sawine@72
   254
sawine@72
   255
function test(c, max_iter) 
sawine@72
   256
{
sawine@72
   257
	var iter = 0;
sawine@72
   258
	var z = new Complex(0.0, 0.0);
sawine@72
   259
	var last_z = new Complex(-1.0, 0.0);
sawine@72
   260
	var quad_z = complex_quad_value(z);
sawine@72
   261
	
sawine@72
   262
	while (iter < max_iter
sawine@72
   263
		&& !complex_equal(z, last_z)
sawine@72
   264
		&& quad_z <= bailout)
sawine@72
   265
	{
sawine@72
   266
		last_z = z;
sawine@72
   267
		z = iterate(z, c);
sawine@72
   268
		quad_z = complex_quad_value(z);
sawine@72
   269
		iter++;
sawine@72
   270
	}
sawine@72
   271
	return new Result(quad_z, iter);
sawine@72
   272
}
sawine@72
   273
sawine@72
   274
function draw(diter, dx, dy, dz, dres)
sawine@72
   275
{  
sawine@72
   276
	var canvas = document.getElementById('mandelbrot'); 
sawine@72
   277
	
sawine@72
   278
	if (canvas.getContext)
sawine@72
   279
	{  
sawine@72
   280
		zoom += dz;
sawine@72
   281
		var ctx = canvas.getContext('2d');
sawine@72
   282
sawine@72
   283
		if (dres != 0)
sawine@72
   284
		{		
sawine@72
   285
			resolution = Math.max(1, resolution + dres);
sawine@72
   286
		}
sawine@72
   287
sawine@72
   288
		if (diter != 0)
sawine@72
   289
		{
sawine@72
   290
			max_iter = Math.max(MIN_ITER, max_iter + diter);
sawine@72
   291
		}
sawine@72
   292
		
sawine@72
   293
		var red = "rgb(255, 0, 0)";
sawine@72
   294
		var white = "rgb(255, 255, 255)";
sawine@72
   295
		var width = canvas.width;
sawine@72
   296
		var height = canvas.height;
sawine@72
   297
		var dim = Math.max(width, height);
sawine@72
   298
		var dim_ratio = Math.round(width / height);	
sawine@72
   299
		var diff_c = new Complex(max_c.real - min_c.real,
sawine@72
   300
			max_c.imag - min_c.imag);
sawine@72
   301
		dx_min = diff_c.real / 100 * (dx + dz);
sawine@72
   302
		dx_max = diff_c.real / 100 * (dx - dz);
sawine@72
   303
sawine@72
   304
		dy_min = diff_c.imag / 100 * (dy + dz);
sawine@72
   305
		dy_max = diff_c.imag / 100 * (dy - dz);
sawine@72
   306
sawine@72
   307
		var min_inc = new Complex(dx_min * dim_ratio / 2.0, dy_min);
sawine@72
   308
		var max_inc = new Complex(dx_max * dim_ratio / 2.0, dy_max);
sawine@72
   309
		min_c = complex_add(min_c, min_inc);
sawine@72
   310
		max_c = complex_add(max_c, max_inc);
sawine@72
   311
		diff_c = new Complex(max_c.real - min_c.real,
sawine@72
   312
			max_c.imag - min_c.imag);
sawine@72
   313
		
sawine@72
   314
		for (var y = 0; y < height; y += resolution) 
sawine@72
   315
		{
sawine@72
   316
			for (var x = 0; x < width; x += resolution) 
sawine@72
   317
			{    			
sawine@72
   318
				var c = new Complex(min_c.real + diff_c.real / dim * x, 
sawine@72
   319
					min_c.imag + diff_c.imag / dim * y);  	
sawine@72
   320
			 	var result = test(c, max_iter);	
sawine@72
   321
		 		var r = Math.min(255, Math.pow(Math.max(0, 
sawine@72
   322
		 			(result.iter - max_iter / 20.0)), 2));
sawine@72
   323
				var g = Math.min(255, Math.pow(Math.max(0, 
sawine@72
   324
					(result.iter - max_iter / 25.0)), 2));			
sawine@72
   325
		 		var b = Math.min(255, Math.pow(Math.max(0, 
sawine@72
   326
					(result.iter - max_iter / 20.0)), 2));
sawine@72
   327
		 		var colour = "rgb(" + r + "," + g + "," + b + ")";
sawine@72
   328
		 		ctx.fillStyle = colour; 
sawine@72
   329
				ctx.fillRect(x, y, resolution, resolution);			
sawine@72
   330
			}
sawine@72
   331
  		}
sawine@72
   332
	}  
sawine@72
   333
} 
sawine@72
   334
sawine@72
   335
function getEventOffsetX(evt)
sawine@72
   336
{
sawine@72
   337
	if (evt.offsetX != null)
sawine@72
   338
		return evt.offsetX;
sawine@72
   339
 
sawine@72
   340
    var obj = evt.target || evt.srcElement;
sawine@72
   341
   	setPageTopLeft(obj);
sawine@72
   342
    return (evt.clientX - obj.pageLeft);
sawine@72
   343
}
sawine@72
   344
sawine@72
   345
function getEventOffsetY(evt)
sawine@72
   346
{
sawine@72
   347
	if (evt.offsetY != null)
sawine@72
   348
		return evt.offsetY;
sawine@72
   349
 
sawine@72
   350
    var obj = evt.target || evt.srcElement;
sawine@72
   351
   	setPageTopLeft(obj);
sawine@72
   352
    return (evt.clientY - obj.pageTop);
sawine@72
   353
}
sawine@72
   354
 
sawine@72
   355
function setPageTopLeft( o )
sawine@72
   356
{
sawine@72
   357
    var top = 0,
sawine@72
   358
    left = 0,
sawine@72
   359
    obj = o;
sawine@72
   360
 
sawine@72
   361
    while (o.offsetParent)
sawine@72
   362
     {
sawine@72
   363
         left += o.offsetLeft ;
sawine@72
   364
         top += o.offsetTop ;
sawine@72
   365
         o = o.offsetParent ;
sawine@72
   366
    };
sawine@72
   367
 
sawine@72
   368
    obj.pageTop = top;
sawine@72
   369
    obj.pageLeft = left; 
sawine@72
   370
}
sawine@72
   371
 
sawine@72
   372
function draw2(evt)
sawine@72
   373
{
sawine@72
   374
	var iter = 0;
sawine@72
   375
	var res = 0;
sawine@72
   376
	var x = (getEventOffsetX(evt) - 335) / 167.5;
sawine@72
   377
    var y = (getEventOffsetY(evt) - 140) / 70;
sawine@72
   378
	var z = 0;
sawine@72
   379
	draw(iter, x, y, z, res);
sawine@72
   380
}
sawine@72
   381
sawine@72
   382