Smaller logo.
1.1 --- a/books.html Sun Dec 18 19:15:59 2011 +0100
1.2 +++ b/books.html Tue Dec 20 03:01:50 2011 +0100
1.3 @@ -28,8 +28,7 @@
1.4 <div id="header">
1.5 <canvas id="logo">
1.6 FIND A BETTER BROWSER
1.7 - </canvas>
1.8 -
1.9 + </canvas>
1.10 </div>
1.11 <div id="content-wrap">
1.12 <div id="main">
2.1 --- a/dark.css Sun Dec 18 19:15:59 2011 +0100
2.2 +++ b/dark.css Tue Dec 20 03:01:50 2011 +0100
2.3 @@ -110,7 +110,7 @@
2.4 color: #F8F8F8;
2.5 /* change the values of top and left to adjust the position of the logo*/
2.6 top: 40px; left: 25px;
2.7 - height: 120px;
2.8 + height: 100px;
2.9 width: 670px;
2.10 }
2.11
2.12 @@ -225,7 +225,7 @@
2.13 #header {
2.14 position: relative;
2.15 width: 1020px;
2.16 - height: 170px;
2.17 + height: 150px;
2.18 margin: 0;
2.19 padding: 0;
2.20 }
3.1 --- a/experiments.html Sun Dec 18 19:15:59 2011 +0100
3.2 +++ b/experiments.html Tue Dec 20 03:01:50 2011 +0100
3.3 @@ -28,8 +28,7 @@
3.4 <div id="header">
3.5 <canvas id="logo">
3.6 FIND A BETTER BROWSER
3.7 - </canvas>
3.8 -
3.9 + </canvas>
3.10 </div>
3.11 <div id="content-wrap">
3.12 <div id="main">
4.1 Binary file factory/raw_images/logobase.xcf has changed
5.1 --- a/factory/v2012/dark.css Sun Dec 18 19:15:59 2011 +0100
5.2 +++ b/factory/v2012/dark.css Tue Dec 20 03:01:50 2011 +0100
5.3 @@ -110,7 +110,7 @@
5.4 color: #F8F8F8;
5.5 /* change the values of top and left to adjust the position of the logo*/
5.6 top: 40px; left: 25px;
5.7 - height: 120px;
5.8 + height: 100px;
5.9 width: 670px;
5.10 }
5.11
5.12 @@ -225,7 +225,7 @@
5.13 #header {
5.14 position: relative;
5.15 width: 1020px;
5.16 - height: 170px;
5.17 + height: 150px;
5.18 margin: 0;
5.19 padding: 0;
5.20 }
6.1 --- a/factory/v2012/frame.html Sun Dec 18 19:15:59 2011 +0100
6.2 +++ b/factory/v2012/frame.html Tue Dec 20 03:01:50 2011 +0100
6.3 @@ -28,8 +28,7 @@
6.4 <div id="header">
6.5 <canvas id="logo">
6.6 FIND A BETTER BROWSER
6.7 - </canvas>
6.8 -
6.9 + </canvas>
6.10 </div>
6.11 <div id="content-wrap">
6.12 <div id="main">
7.1 --- a/factory/v2012/links.html Sun Dec 18 19:15:59 2011 +0100
7.2 +++ b/factory/v2012/links.html Tue Dec 20 03:01:50 2011 +0100
7.3 @@ -13,7 +13,7 @@
7.4
7.5 <h2>The Bad</h2>
7.6 <ul>
7.7 -<li><h4><a href="https://twitter.com/notchnik">@notchnik</a></h4>
7.8 +<li><h4><a href="https://twitter.com/notchnik">@sowae</a></h4>
7.9 The emptyness in 140 characters.
7.10 </li>
7.11 <li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
7.12 @@ -21,7 +21,7 @@
7.13 </li>
7.14 </ul>
7.15
7.16 -<h2>The People and their Sites</h2>
7.17 +<h2>People and their Sites</h2>
7.18 <ul>
7.19 <li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
7.20 An ex-fellow student and companion in the quest for world domination.
8.1 --- a/factory/v2012/linksend.html Sun Dec 18 19:15:59 2011 +0100
8.2 +++ b/factory/v2012/linksend.html Tue Dec 20 03:01:50 2011 +0100
8.3 @@ -13,7 +13,7 @@
8.4
8.5 <h2>The Bad</h2>
8.6 <ul>
8.7 -<li><h4><a href="https://twitter.com/notchnik">@notchnik</a></h4>
8.8 +<li><h4><a href="https://twitter.com/notchnik">@sowae</a></h4>
8.9 The emptyness in 140 characters.
8.10 </li>
8.11 <li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
8.12 @@ -21,7 +21,7 @@
8.13 </li>
8.14 </ul>
8.15
8.16 -<h2>The People and their Sites</h2>
8.17 +<h2>People and their Sites</h2>
8.18 <ul>
8.19 <li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
8.20 An ex-fellow student and companion in the quest for world domination.
9.1 --- a/factory/v2012/script.js Sun Dec 18 19:15:59 2011 +0100
9.2 +++ b/factory/v2012/script.js Tue Dec 20 03:01:50 2011 +0100
9.3 @@ -11,7 +11,7 @@
9.4 $(this).css("cursor", "pointer");
9.5 }, function() {
9.6 $(this).css("cursor", "auto");
9.7 - });
9.8 + });
9.9 });
9.10
9.11 $(document).keypress( function(event) {
9.12 @@ -22,8 +22,8 @@
9.13 });
9.14
9.15 var menu_width = 670;
9.16 -var menu_height = 120;
9.17 -var menu_splits = new Array(150, 350, 545);
9.18 +var menu_height = 100;
9.19 +var menu_splits = new Array(180, 350, 505);
9.20
9.21 var click_events = new Array();
9.22 click_events["logo"] = new Array();
9.23 @@ -56,15 +56,21 @@
9.24 click_events["logo"][3]["func"] = switch_page;
9.25 click_events["logo"][3]["args"] = new Array("links.html", "linksend.html");
9.26
9.27 -function handle_click(e) {
9.28 - var offset = $("#logo").offset();
9.29 - var x = e.pageX - offset.left;
9.30 - var y = e.pageY - offset.top;
9.31 - for (var i in click_events[e.target.id]) {
9.32 - var ces = click_events[e.target.id][i];
9.33 +function mouse_pos(event) {
9.34 + var offset = $("#logo").offset();
9.35 + return new Array(event.pageX - offset.left,
9.36 + event.pageY - offset.top);
9.37 +}
9.38 +
9.39 +function handle_click(event) {
9.40 + var xy = mouse_pos(event);
9.41 + var x = xy[0];
9.42 + var y = xy[1];
9.43 + for (var i in click_events[event.target.id]) {
9.44 + var ces = click_events[event.target.id][i];
9.45 if (ces && x >= ces["min_x"] && x <= ces["max_x"]
9.46 && y >= ces["min_y"] && y <= ces["max_y"]) {
9.47 - ces["func"](e.target.id, ces);
9.48 + ces["func"](event.target.id, ces);
9.49 break;
9.50 }
9.51 }
9.52 @@ -76,10 +82,7 @@
9.53 document.location.href = page;
9.54 }
9.55
9.56 -function color_area(id, min_x, max_x, min_y, max_y, colour) {
9.57 - var canvas = document.getElementById(id);
9.58 - var context = canvas.getContext("2d");
9.59 - var image = context.getImageData(0, 0, menu_width, menu_height);
9.60 +function colour_area(image, min_x, max_x, min_y, max_y, colour) {
9.61 var pixels = image.data;
9.62 for (var y = min_y; y <= max_y; y += 1) {
9.63 for (var x = min_x; x <= max_x; x += 1) {
9.64 @@ -89,34 +92,46 @@
9.65 setPixel(image, x, y, colour);
9.66 }
9.67 }
9.68 - }
9.69 - context.putImageData(image, 0, 0);
9.70 + }
9.71 }
9.72
9.73 function init_logo(event) {
9.74 var canvas = document.getElementById("logo");
9.75 - var context = canvas.getContext("2d");
9.76 - var image = context.getImageData(0, 0, menu_width, menu_height);
9.77 + var context = canvas.getContext("2d");
9.78 canvas.width = menu_width;
9.79 canvas.height = menu_height;
9.80 context.drawImage(event.target, 0, 0);
9.81 + var image = context.getImageData(0, 0, menu_width, menu_height);
9.82 var white = new Colour(255, 255, 255);
9.83 + var black = new Colour(0, 0, 0);
9.84 + var orange = new Colour(201, 87, 35);
9.85 + var green = new Colour(90, 215, 21);
9.86 + var found = false;
9.87 for (var i in click_events["logo"]) {
9.88 - var p = click_events["logo"][i];
9.89 + var p = click_events["logo"][i];
9.90 + var min_x = p["min_x"];
9.91 + var max_x = p["max_x"];
9.92 + var min_y = p["min_y"];
9.93 + var max_y = p["max_y"];
9.94 var pos = document.location.href.lastIndexOf("/") + 1;
9.95 - var page = document.location.href.substr(pos);
9.96 - var found = false;
9.97 + var page = document.location.href.substr(pos);
9.98 for (var j in p["args"]) {
9.99 if (page == p["args"][j]) {
9.100 - color_area("logo", p["min_x"], p["max_x"], 70, p["max_y"], white);
9.101 - found = true;
9.102 + colour_area(image, min_x, max_x, 0, 60, orange);
9.103 + colour_area(image, min_x, max_x, 60, max_y, white);
9.104 + found = p;
9.105 break;
9.106 }
9.107 }
9.108 if (!found) {
9.109 - color_area("logo", p["min_x"], p["max_x"], 0, 70, white);
9.110 + colour_area(image, min_x, max_x, 0, 60, white);
9.111 + colour_area(image, min_x, max_x, 60, max_y, orange);
9.112 }
9.113 - }
9.114 + }
9.115 + context.putImageData(image, 0, 0);
9.116 + // context.fillStyle = green.str();
9.117 + // console.log((found["max_x"] - found["min_x"]) / 2 + found["min_x"] - 2);
9.118 + // context.fillRect((found["max_x"]-found["min_x"])/2+found["min_x"]-1, 95, 2, 5);
9.119 drawMenuLines();
9.120 }
9.121
9.122 @@ -216,7 +231,7 @@
9.123 this.r = r;
9.124 this.g = g;
9.125 this.b = b;
9.126 - this.a = a == undefined ? 1 : a;
9.127 + this.a = a == undefined ? 255 : a;
9.128 }
9.129 Colour.prototype.equals = function(rhs) {
9.130 for (p in this) {
9.131 @@ -231,12 +246,12 @@
9.132 return "rgba(" + this.r + "," + this.g + "," + this.b + "," + this.a + ")";
9.133 }
9.134
9.135 -function setPixel(image, x, y, color) {
9.136 +function setPixel(image, x, y, colour) {
9.137 var index = 4 * (x + y * image.width);
9.138 - image.data[index] = color.r;
9.139 - image.data[index + 1] = color.g;
9.140 - image.data[index + 2] = color.b;
9.141 - image.data[index + 3] = color.a;
9.142 + image.data[index] = colour.r;
9.143 + image.data[index + 1] = colour.g;
9.144 + image.data[index + 2] = colour.b;
9.145 + image.data[index + 3] = colour.a;
9.146 }
9.147
9.148 function getPixel(image, x, y) {
10.1 --- a/howiwork.html Sun Dec 18 19:15:59 2011 +0100
10.2 +++ b/howiwork.html Tue Dec 20 03:01:50 2011 +0100
10.3 @@ -28,8 +28,7 @@
10.4 <div id="header">
10.5 <canvas id="logo">
10.6 FIND A BETTER BROWSER
10.7 - </canvas>
10.8 -
10.9 + </canvas>
10.10 </div>
10.11 <div id="content-wrap">
10.12 <div id="main">
11.1 Binary file images/logobase.png has changed
12.1 --- a/index.html Sun Dec 18 19:15:59 2011 +0100
12.2 +++ b/index.html Tue Dec 20 03:01:50 2011 +0100
12.3 @@ -28,8 +28,7 @@
12.4 <div id="header">
12.5 <canvas id="logo">
12.6 FIND A BETTER BROWSER
12.7 - </canvas>
12.8 -
12.9 + </canvas>
12.10 </div>
12.11 <div id="content-wrap">
12.12 <div id="main">
13.1 --- a/links.html Sun Dec 18 19:15:59 2011 +0100
13.2 +++ b/links.html Tue Dec 20 03:01:50 2011 +0100
13.3 @@ -28,8 +28,7 @@
13.4 <div id="header">
13.5 <canvas id="logo">
13.6 FIND A BETTER BROWSER
13.7 - </canvas>
13.8 -
13.9 + </canvas>
13.10 </div>
13.11 <div id="content-wrap">
13.12 <div id="main">
13.13 @@ -48,7 +47,7 @@
13.14
13.15 <h2>The Bad</h2>
13.16 <ul>
13.17 -<li><h4><a href="https://twitter.com/notchnik">@notchnik</a></h4>
13.18 +<li><h4><a href="https://twitter.com/notchnik">@sowae</a></h4>
13.19 The emptyness in 140 characters.
13.20 </li>
13.21 <li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
13.22 @@ -56,7 +55,7 @@
13.23 </li>
13.24 </ul>
13.25
13.26 -<h2>The People and their Sites</h2>
13.27 +<h2>People and their Sites</h2>
13.28 <ul>
13.29 <li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
13.30 An ex-fellow student and companion in the quest for world domination.
14.1 --- a/linksend.html Sun Dec 18 19:15:59 2011 +0100
14.2 +++ b/linksend.html Tue Dec 20 03:01:50 2011 +0100
14.3 @@ -28,8 +28,7 @@
14.4 <div id="header">
14.5 <canvas id="logo">
14.6 FIND A BETTER BROWSER
14.7 - </canvas>
14.8 -
14.9 + </canvas>
14.10 </div>
14.11 <div id="content-wrap">
14.12 <div id="main">
14.13 @@ -48,7 +47,7 @@
14.14
14.15 <h2>The Bad</h2>
14.16 <ul>
14.17 -<li><h4><a href="https://twitter.com/notchnik">@notchnik</a></h4>
14.18 +<li><h4><a href="https://twitter.com/notchnik">@sowae</a></h4>
14.19 The emptyness in 140 characters.
14.20 </li>
14.21 <li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
14.22 @@ -56,7 +55,7 @@
14.23 </li>
14.24 </ul>
14.25
14.26 -<h2>The People and their Sites</h2>
14.27 +<h2>People and their Sites</h2>
14.28 <ul>
14.29 <li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
14.30 An ex-fellow student and companion in the quest for world domination.
15.1 --- a/personalwork.html Sun Dec 18 19:15:59 2011 +0100
15.2 +++ b/personalwork.html Tue Dec 20 03:01:50 2011 +0100
15.3 @@ -28,8 +28,7 @@
15.4 <div id="header">
15.5 <canvas id="logo">
15.6 FIND A BETTER BROWSER
15.7 - </canvas>
15.8 -
15.9 + </canvas>
15.10 </div>
15.11 <div id="content-wrap">
15.12 <div id="main">
16.1 --- a/resume.html Sun Dec 18 19:15:59 2011 +0100
16.2 +++ b/resume.html Tue Dec 20 03:01:50 2011 +0100
16.3 @@ -28,8 +28,7 @@
16.4 <div id="header">
16.5 <canvas id="logo">
16.6 FIND A BETTER BROWSER
16.7 - </canvas>
16.8 -
16.9 + </canvas>
16.10 </div>
16.11 <div id="content-wrap">
16.12 <div id="main">
17.1 --- a/script.js Sun Dec 18 19:15:59 2011 +0100
17.2 +++ b/script.js Tue Dec 20 03:01:50 2011 +0100
17.3 @@ -11,7 +11,7 @@
17.4 $(this).css("cursor", "pointer");
17.5 }, function() {
17.6 $(this).css("cursor", "auto");
17.7 - });
17.8 + });
17.9 });
17.10
17.11 $(document).keypress( function(event) {
17.12 @@ -22,8 +22,8 @@
17.13 });
17.14
17.15 var menu_width = 670;
17.16 -var menu_height = 120;
17.17 -var menu_splits = new Array(150, 350, 545);
17.18 +var menu_height = 100;
17.19 +var menu_splits = new Array(180, 350, 505);
17.20
17.21 var click_events = new Array();
17.22 click_events["logo"] = new Array();
17.23 @@ -56,15 +56,21 @@
17.24 click_events["logo"][3]["func"] = switch_page;
17.25 click_events["logo"][3]["args"] = new Array("links.html", "linksend.html");
17.26
17.27 -function handle_click(e) {
17.28 - var offset = $("#logo").offset();
17.29 - var x = e.pageX - offset.left;
17.30 - var y = e.pageY - offset.top;
17.31 - for (var i in click_events[e.target.id]) {
17.32 - var ces = click_events[e.target.id][i];
17.33 +function mouse_pos(event) {
17.34 + var offset = $("#logo").offset();
17.35 + return new Array(event.pageX - offset.left,
17.36 + event.pageY - offset.top);
17.37 +}
17.38 +
17.39 +function handle_click(event) {
17.40 + var xy = mouse_pos(event);
17.41 + var x = xy[0];
17.42 + var y = xy[1];
17.43 + for (var i in click_events[event.target.id]) {
17.44 + var ces = click_events[event.target.id][i];
17.45 if (ces && x >= ces["min_x"] && x <= ces["max_x"]
17.46 && y >= ces["min_y"] && y <= ces["max_y"]) {
17.47 - ces["func"](e.target.id, ces);
17.48 + ces["func"](event.target.id, ces);
17.49 break;
17.50 }
17.51 }
17.52 @@ -76,10 +82,7 @@
17.53 document.location.href = page;
17.54 }
17.55
17.56 -function color_area(id, min_x, max_x, min_y, max_y, colour) {
17.57 - var canvas = document.getElementById(id);
17.58 - var context = canvas.getContext("2d");
17.59 - var image = context.getImageData(0, 0, menu_width, menu_height);
17.60 +function colour_area(image, min_x, max_x, min_y, max_y, colour) {
17.61 var pixels = image.data;
17.62 for (var y = min_y; y <= max_y; y += 1) {
17.63 for (var x = min_x; x <= max_x; x += 1) {
17.64 @@ -89,34 +92,46 @@
17.65 setPixel(image, x, y, colour);
17.66 }
17.67 }
17.68 - }
17.69 - context.putImageData(image, 0, 0);
17.70 + }
17.71 }
17.72
17.73 function init_logo(event) {
17.74 var canvas = document.getElementById("logo");
17.75 - var context = canvas.getContext("2d");
17.76 - var image = context.getImageData(0, 0, menu_width, menu_height);
17.77 + var context = canvas.getContext("2d");
17.78 canvas.width = menu_width;
17.79 canvas.height = menu_height;
17.80 context.drawImage(event.target, 0, 0);
17.81 + var image = context.getImageData(0, 0, menu_width, menu_height);
17.82 var white = new Colour(255, 255, 255);
17.83 + var black = new Colour(0, 0, 0);
17.84 + var orange = new Colour(201, 87, 35);
17.85 + var green = new Colour(90, 215, 21);
17.86 + var found = false;
17.87 for (var i in click_events["logo"]) {
17.88 - var p = click_events["logo"][i];
17.89 + var p = click_events["logo"][i];
17.90 + var min_x = p["min_x"];
17.91 + var max_x = p["max_x"];
17.92 + var min_y = p["min_y"];
17.93 + var max_y = p["max_y"];
17.94 var pos = document.location.href.lastIndexOf("/") + 1;
17.95 - var page = document.location.href.substr(pos);
17.96 - var found = false;
17.97 + var page = document.location.href.substr(pos);
17.98 for (var j in p["args"]) {
17.99 if (page == p["args"][j]) {
17.100 - color_area("logo", p["min_x"], p["max_x"], 70, p["max_y"], white);
17.101 - found = true;
17.102 + colour_area(image, min_x, max_x, 0, 60, orange);
17.103 + colour_area(image, min_x, max_x, 60, max_y, white);
17.104 + found = p;
17.105 break;
17.106 }
17.107 }
17.108 if (!found) {
17.109 - color_area("logo", p["min_x"], p["max_x"], 0, 70, white);
17.110 + colour_area(image, min_x, max_x, 0, 60, white);
17.111 + colour_area(image, min_x, max_x, 60, max_y, orange);
17.112 }
17.113 - }
17.114 + }
17.115 + context.putImageData(image, 0, 0);
17.116 + // context.fillStyle = green.str();
17.117 + // console.log((found["max_x"] - found["min_x"]) / 2 + found["min_x"] - 2);
17.118 + // context.fillRect((found["max_x"]-found["min_x"])/2+found["min_x"]-1, 95, 2, 5);
17.119 drawMenuLines();
17.120 }
17.121
17.122 @@ -216,7 +231,7 @@
17.123 this.r = r;
17.124 this.g = g;
17.125 this.b = b;
17.126 - this.a = a == undefined ? 1 : a;
17.127 + this.a = a == undefined ? 255 : a;
17.128 }
17.129 Colour.prototype.equals = function(rhs) {
17.130 for (p in this) {
17.131 @@ -231,12 +246,12 @@
17.132 return "rgba(" + this.r + "," + this.g + "," + this.b + "," + this.a + ")";
17.133 }
17.134
17.135 -function setPixel(image, x, y, color) {
17.136 +function setPixel(image, x, y, colour) {
17.137 var index = 4 * (x + y * image.width);
17.138 - image.data[index] = color.r;
17.139 - image.data[index + 1] = color.g;
17.140 - image.data[index + 2] = color.b;
17.141 - image.data[index + 3] = color.a;
17.142 + image.data[index] = colour.r;
17.143 + image.data[index + 1] = colour.g;
17.144 + image.data[index + 2] = colour.b;
17.145 + image.data[index + 3] = colour.a;
17.146 }
17.147
17.148 function getPixel(image, x, y) {