changeset 103:52297178e0eb laserkard

implemented automatic text resize
author Robert McIntyre <rlm@mit.edu>
date Wed, 28 Jul 2010 06:36:39 -0400
parents 8ed3394e6b73
children a20199a24415
files js-lib/buy3.js kill-comments temp342423/buy3.css temp342423/buy3.js temp342423/kill-comments temp342423/server.clj
diffstat 6 files changed, 89 insertions(+), 414 deletions(-) [+]
line wrap: on
line diff
     1.1 --- a/js-lib/buy3.js	Tue Jul 27 22:23:13 2010 -0400
     1.2 +++ b/js-lib/buy3.js	Wed Jul 28 06:36:39 2010 -0400
     1.3 @@ -1,3 +1,17 @@
     1.4 +//WHY do I have to write this myself!?
     1.5 +Object.prototype.keys = function ()
     1.6 +{
     1.7 +    var keys = [];
     1.8 +    for(i in this) if (this.hasOwnProperty(i))
     1.9 +    {
    1.10 +	keys.push(i);
    1.11 +    }
    1.12 +    return keys;
    1.13 +}
    1.14 +
    1.15 +
    1.16 +
    1.17 +
    1.18  
    1.19  Buy = (function (){ 
    1.20  
    1.21 @@ -10,26 +24,64 @@
    1.22  
    1.23      var draw_card = (function (paper){
    1.24  	
    1.25 -	var helvetica  = paper.getFont('HelveticaNeue', 700);
    1.26 -	var helveticaI = paper.getFont('HelveticaNeue', 800);
    1.27 -	var h = paper.height;
    1.28 -	var w = paper.width;
    1.29 +    	var helvetica  = paper.getFont('HelveticaNeue', 700);
    1.30 +    	var helveticaI = paper.getFont('HelveticaNeue', 800);
    1.31 +    	var h = paper.height;
    1.32 +    	var w = paper.width;
    1.33 +    	var default_color = "#AAAAAA";
    1.34  
    1.35 -	var standard = (function (text, x, y, pt, font){
    1.36 -	    if (!font) {font = helvetica;}
    1.37 +    // 	var clamp = (function (target args){
    1.38 +    // 	    x = args.x || null;
    1.39 +    // 	    y = args.y || null;
    1.40 +	    
    1.41 +    // 	    if (x) {
    1.42 +    // 		if (target.getBBox().width > display.width * x){
    1.43 +    // 		    target.scale(
    1.44 +    // 		}
    1.45 +    // 	    }
    1.46 +
    1.47 +    // 	    if (y)
    1.48 +	    
    1.49 +    // 	});
    1.50 +
    1.51 +	var standard = (function (args){
    1.52 +	    var pt = args.pt || 20;
    1.53 +	    var x = args.x || 0;
    1.54 +	    var y = args.y || 0;
    1.55 +	    var x_max = args.x_max || null;
    1.56 +	    var y_max = args.y_max || null;
    1.57 +	    var font = args.font || helvetica;
    1.58 +	    var text = args.text || "";
    1.59  	    var scale_x = 0.00030*h*pt/20;  
    1.60  	    var scale_y = 0.00025*w*pt/20;
    1.61 -	    return paper.print(h*x, w*y,text, font).scale(
    1.62 -		scale_x,scale_y,h*x,w*y);});
    1.63 +
    1.64 +	    
    1.65 +
    1.66 +	    target = paper.print(h*x, w*y,text, font).scale(
    1.67 +		scale_x,scale_y,h*x,w*y).attr({"fill": default_color});
    1.68 +	
    1.69 +	    if (x_max){
    1.70 +		var width = target.getBBox().width;
    1.71 +		var max_width = paper.width*x_max;
    1.72 +		if (width > max_width){
    1.73 +		    var x_mod = max_width/width;
    1.74 +		    target.scale(scale_x*x_mod,scale_y,0,0);
    1.75 +		}
    1.76 +	    }
    1.77 +	    return target;
    1.78 +	});
    1.79 +	
    1.80 +	
    1.81 +	
    1.82 +
    1.83  
    1.84  	var bold = {
    1.85  	    "name" :(function (text){
    1.86 -		return standard(text, 0.2,0.1,20).attr({"fill" : "red"});}),
    1.87 +		return standard({x_max : 0.5, "text": text, x: 0.2, y: 0.1, pt: 20});}),
    1.88  	    "email" : (function (text){
    1.89 -		return standard(text, 0.2,0.4,20,helveticaI).attr(
    1.90 -		    {"fill" : "red"});})};
    1.91 +		return standard({"text": text, x: 0.2, y: 0.4,pt: 20,font: helveticaI});})};
    1.92  	
    1.93 -	
    1.94 +
    1.95  	return {
    1.96  	    "bold" : bold
    1.97  	};
    1.98 @@ -134,7 +186,7 @@
    1.99      
   1.100      var display_init = (function (){
   1.101      	state_map["display"].ref = 
   1.102 -    	    display.rect(1, 1 , display.width - 1, display.height - 2, 20).attr(
   1.103 +    	    display.rect(1, 1 , display.width - 1, display.height - 2, 15).attr(
   1.104  		state_map["display"].state);
   1.105      });
   1.106      
   1.107 @@ -178,12 +230,12 @@
   1.108  
   1.109  
   1.110      var init = (function () {
   1.111 -	display = Raphael("card-display", 340 ,215);
   1.112 +	display = Raphael("card-display", 360 ,230);
   1.113  	color = Raphael("color-select", 300, 100);
   1.114  	
   1.115 -	style.bold = Raphael("bold", 170, 107);
   1.116 +	style.bold = Raphael("bold", display.width/2, display.height/2);
   1.117  
   1.118 -	style.classic = Raphael("classic", 170 , 107);
   1.119 +	style.classic = Raphael("classic", display.width/2 , display.width/2);
   1.120  	
   1.121  	helvetica = display.getFont('HelveticaNeue', 700);
   1.122  	helvetica_I = display.getFont('HelveticaNeue', 800);
     2.1 --- a/kill-comments	Tue Jul 27 22:23:13 2010 -0400
     2.2 +++ b/kill-comments	Wed Jul 28 06:36:39 2010 -0400
     2.3 @@ -1,13 +1,29 @@
     2.4 -#!/usr/bin/env python
     2.5 +#!/usr/bin/python
     2.6  
     2.7  import subprocess
     2.8  import sys
     2.9 +import os
    2.10  
    2.11  target_file = sys.argv[1]
    2.12  
    2.13 -command =   "emacs -batch " + \
    2.14 +command =   "emacs -batch -l ~/.emacs-batch " + \
    2.15      target_file + \
    2.16 -    " --eval '(kill-comment (point-min) (point-max) nil)' -f save-buffer"
    2.17 +    " --eval '(kill-comment (count-lines (point-min) (point-max)))'" + \
    2.18 +    " -f save-buffer"
    2.19  
    2.20 -print command
    2.21 -subprocess.call(command, shell=True)
    2.22 +#to load a custom .emacs script (for more syntax support),
    2.23 +#use -l <file> in the above command
    2.24 +
    2.25 +#print command
    2.26 +
    2.27 +fnull = open(os.devnull, 'w')
    2.28 +subprocess.call(command, shell = True, stdout = fnull, stderr = fnull)
    2.29 +fnull.close()
    2.30 +
    2.31 +
    2.32 +
    2.33 +
    2.34 +
    2.35 +
    2.36 +
    2.37 +
     3.1 --- a/temp342423/buy3.css	Tue Jul 27 22:23:13 2010 -0400
     3.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     3.3 @@ -1,28 +0,0 @@
     3.4 -div#debug {
     3.5 -    position: absolute;
     3.6 -    top:5%;
     3.7 -    right:10%;
     3.8 -    width: 450px;
     3.9 -    border-color:#DD7777;
    3.10 -    border-width:2px;
    3.11 -    background-color:#bf3f9b;
    3.12 -    font: bold 15px "helvetica","arial", "sans-serif";
    3.13 -    color: white;
    3.14 -    height: 200px;
    3.15 -    display : none;
    3.16 -}
    3.17 -
    3.18 -div#text-entry {
    3.19 -    position : absolute;
    3.20 -    top : 15%;
    3.21 -    left : 25%;
    3.22 -    width : 150px;
    3.23 -}
    3.24 -
    3.25 -.hidden {
    3.26 -    display : none;
    3.27 -}
    3.28 -
    3.29 -input.exampleText {
    3.30 -  color: #aaa;
    3.31 -}
     4.1 --- a/temp342423/buy3.js	Tue Jul 27 22:23:13 2010 -0400
     4.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     4.3 @@ -1,310 +0,0 @@
     4.4 -
     4.5 -Buy = (function (){ 
     4.6 -
     4.7 -
     4.8 -    
     4.9 -    var magic_font_ratio = 318;
    4.10 -    var mfg = magic_font_ratio;
    4.11 -    
    4.12 -
    4.13 -
    4.14 -    var draw_card = (function (paper){
    4.15 -	
    4.16 -	var helvetica  = paper.getFont('HelveticaNeue', 700);
    4.17 -	var helveticaI = paper.getFont('HelveticaNeue', 800);
    4.18 -	var h = paper.height;
    4.19 -	var w = paper.width;
    4.20 -
    4.21 -	var standard = (function (text, x, y, pt, font){
    4.22 -	    if (!font) {font = helvetica;}
    4.23 -	    var scale_x = 0.00030*h*pt/20;  
    4.24 -	    var scale_y = 0.00025*w*pt/20;
    4.25 -	    return paper.print(h*x, w*y,text, font).scale(
    4.26 -		scale_x,scale_y,h*x,w*y);});
    4.27 -
    4.28 -	var bold = {
    4.29 -	    "name" :(function (text){
    4.30 -		return standard(text, 0.2,0.1,20).attr({"fill" : "red"});}),
    4.31 -	    "email" : (function (text){
    4.32 -		return standard(text, 0.2,0.4,20,helveticaI).attr(
    4.33 -		    {"fill" : "red"});})};
    4.34 -	
    4.35 -	
    4.36 -	return {
    4.37 -	    "bold" : bold
    4.38 -	};
    4.39 -	
    4.40 -    });
    4.41 -
    4.42 -
    4.43 -
    4.44 -
    4.45 -
    4.46 -
    4.47 -    
    4.48 -
    4.49 -
    4.50 -
    4.51 -    
    4.52 -
    4.53 -
    4.54 -
    4.55 -
    4.56 -    var switchText = (function (){
    4.57 -	if ($(this).val() == $(this).attr('title'))
    4.58 -	    $(this).val('').removeClass('exampleText');
    4.59 -	else if ($.trim($(this).val()) == '')
    4.60 -	    $(this).addClass('exampleText').val($(this).attr('title'));});
    4.61 -
    4.62 -
    4.63 -    var deref = (function (var_name){return var_name;});
    4.64 -
    4.65 -
    4.66 -
    4.67 -
    4.68 -
    4.69 -    var card;
    4.70 -	
    4.71 -    var card_init = (function () {
    4.72 -	
    4.73 -	card = {
    4.74 -	    name       : {text: "Robert McIntyre", ref: display.set()},
    4.75 -	    company    : {text: "", ref: display.set()},
    4.76 -	    occupation : {text: "", ref: display.set()},
    4.77 -	    phone      : {text: "", ref: display.set()},
    4.78 -	    email      : {text: "rlm@mit.edu", ref: display.set()},
    4.79 -	    website    : {text: "", ref: display.set()},
    4.80 -	    decoration : {text: "", ref: display.set()}};
    4.81 -    });
    4.82 -
    4.83 -
    4.84 -    var order = 
    4.85 -	{color : "blue",
    4.86 -	 style : "bold",
    4.87 -	 quantity : 30,
    4.88 -	 content : undefined,
    4.89 -	 info : undefined,
    4.90 -	 name : "Robert McIntyre",
    4.91 -	 occupation : "AI Researcher",
    4.92 -	 phone : "617.821.9129",
    4.93 -	 email : "rlm@mit.edu",
    4.94 -	 website : "www.rlmcintyre.com",
    4.95 -	 company : "LaserKard LLC." 
    4.96 -	};
    4.97 -    
    4.98 -    var display;
    4.99 -    var color;
   4.100 -    var style = {};
   4.101 -    var helvetica;
   4.102 -    var helvetica_I;
   4.103 -
   4.104 -    var state_map = {
   4.105 -    	bold  : null,
   4.106 -	classic : null,
   4.107 -	
   4.108 -	green : {ref : null, 
   4.109 -    		 offState : {"fill" : "#030", "scale": 1} , 
   4.110 -    		 onState :  {"fill" : "#0F0", "scale": 1}},
   4.111 -    	red  : {ref : null,
   4.112 -    		offState: {"fill" : "#300", "scale" : 1},
   4.113 -    		onState : {"fill" : "#F00" ,"scale" : 1}},
   4.114 -    	blue  : {ref : null,
   4.115 -    		 offState : {"fill" : "#003", "scale": 1}, 
   4.116 -    		 onState  : {"fill" : "#00F", "scale": 1}, 
   4.117 -    	    ref : null},
   4.118 -    	black : {offState : null, onState : null, ref : null},
   4.119 -    	display : {ref : null, state : {"fill" : "black"}}};
   4.120 -
   4.121 -    var color_select_init = (function (){
   4.122 -	state_map["red"].ref = 
   4.123 -	    color.rect(160, 1, 70, 50, 10).attr(state_map["red"].offState);
   4.124 -	state_map["red"].ref.node.onclick = 
   4.125 -	    (function (){order.color= "red"; update();});
   4.126 -	state_map["green"].ref = 
   4.127 -	    color.rect(1, 1, 70, 50, 10).attr(state_map["green"].offState);
   4.128 -	state_map["green"].ref.node.onclick = 
   4.129 -	    (function (){order.color= "green"; update();});
   4.130 -	state_map["blue"].ref = 
   4.131 -	    color.rect(80, 1, 70, 50, 10).attr(state_map["blue"].offState);
   4.132 -	state_map["blue"].ref.node.onclick = 
   4.133 -	    (function (){order.color= "blue"; update();});
   4.134 -	
   4.135 -	toggle_on(state_map[order.color]);
   4.136 -    });
   4.137 -    
   4.138 -    var display_init = (function (){
   4.139 -    	state_map["display"].ref = 
   4.140 -    	    display.rect(1, 1 , display.width - 1, display.height - 2, 20).attr(
   4.141 -		state_map["display"].state);
   4.142 -    });
   4.143 -    
   4.144 -    var text_entry_init = (function (){
   4.145 -	$('input[type=text][title!=""]').each(function() {
   4.146 -	    if ($.trim($(this).val()) == ''){
   4.147 -		$(this).val($(this).attr('title'));}
   4.148 -	    if ($(this).val() == $(this).attr('title')){
   4.149 -		$(this).addClass('exampleText');}
   4.150 -	}).focus(switchText).blur(switchText);
   4.151 -	
   4.152 -	$('form').submit(function() {
   4.153 -	    $(this).find('input[type=text][title!=""]').each(function() {
   4.154 -		if ($(this).val() == $(this).attr('title')){
   4.155 -		    $(this).val('');}})})});
   4.156 -
   4.157 -    var style_text = {
   4.158 -	phone : "617.821.9129",
   4.159 -	email : "rlm@mit.edu",
   4.160 -	website : "www.rlmcintyre.com",
   4.161 -	name : "Robert McIntyre",
   4.162 -	company : "LaserKard LLC.",
   4.163 -	occupation : "AI Researcher"}
   4.164 -
   4.165 -
   4.166 -    var style_init = (function (){
   4.167 -	var draw = draw_card(style.bold);
   4.168 -	draw.bold.name(style_text.name);
   4.169 -	style.bold.rect(1, 1 ,style.bold.width - 1, style.bold.height - 2, 10);
   4.170 -	draw.bold.email(style_text.email);
   4.171 -
   4.172 -
   4.173 -
   4.174 -
   4.175 -
   4.176 -
   4.177 -	
   4.178 -    });
   4.179 -
   4.180 -    
   4.181 -
   4.182 -
   4.183 -    var init = (function () {
   4.184 -	display = Raphael("card-display", 340 ,215);
   4.185 -	color = Raphael("color-select", 300, 100);
   4.186 -	
   4.187 -	style.bold = Raphael("bold", 170, 107);
   4.188 -
   4.189 -	style.classic = Raphael("classic", 170 , 107);
   4.190 -	
   4.191 -	helvetica = display.getFont('HelveticaNeue', 700);
   4.192 -	helvetica_I = display.getFont('HelveticaNeue', 800);
   4.193 -	color_select_init();
   4.194 -	display_init();
   4.195 -	card_init();	
   4.196 -	text_entry_init();
   4.197 -	key_handling();
   4.198 -	style_init();
   4.199 -	update();
   4.200 -    });
   4.201 -
   4.202 -	
   4.203 -
   4.204 -    
   4.205 -    var toggle_on = (function (button){
   4.206 -	button.ref.animate(button.onState, 2000);
   4.207 -    });
   4.208 -    
   4.209 -    var toggle_off = (function (button){
   4.210 -	button.ref.animate(button.offState, 2000);
   4.211 -    });
   4.212 -    
   4.213 -    var color_select_update = (function (){
   4.214 -	var color = order.color;
   4.215 -	return (function (){
   4.216 -	    if (order.color === color){}
   4.217 -	    else {
   4.218 -		toggle_off(state_map[color]);
   4.219 -		toggle_on(state_map[(order.color)]);
   4.220 -		color = order.color;}
   4.221 -	});})(); 
   4.222 -    
   4.223 -    var display_color_update = (function (){
   4.224 -    	var color = state_map.display.state.fill 
   4.225 -
   4.226 -    	return (function (){
   4.227 -    	    if (order.color === color){}
   4.228 -    	    else {
   4.229 -    		state_map["display"].ref.animate(
   4.230 -		    {"fill" : state_map[order.color].onState.fill}, 2000);
   4.231 -    		color = order.color;}})})();
   4.232 -    
   4.233 -    var display_style_update = (function (){
   4.234 -	var style = null;
   4.235 -	return (function (){
   4.236 -	    if (style !== order.style){
   4.237 -		""; }});
   4.238 -	});
   4.239 -
   4.240 -    var key_handling = (function (){
   4.241 -	var assoc = (function (target, field) {
   4.242 -	    $(target).keyup(function() {
   4.243 -		field.text = $(target).val();
   4.244 -		update();})});
   4.245 -	assoc('#user-name', card.name);
   4.246 -	assoc('#user-phone', card.phone);
   4.247 -	assoc('#user-email', card.email);
   4.248 -	assoc('#user-company', card.company);
   4.249 -	assoc('#user-occupation', card.occupation);
   4.250 -	assoc('#user-website', card.website);
   4.251 -    });
   4.252 -
   4.253 -    var display_style_update = (function (){
   4.254 -	var style = null;
   4.255 -	
   4.256 -	return (function () {
   4.257 -	    var draw = draw_card(display);
   4.258 -	    if (style !== order.style){
   4.259 -		for ( var property in card ){
   4.260 -		    if (!draw[order.style][(deref(property))]){
   4.261 -			$("#user" + "-" + property).toggle(400);}}
   4.262 -		style = order.style;}	
   4.263 -	});})();
   4.264 -
   4.265 -    var display_text_update = (function (){
   4.266 -	var state = {name : "nothing",
   4.267 -		     phone: "nothing",
   4.268 -		     email: "nothing",
   4.269 -		     occupation: "nothing",
   4.270 -		     company : "nothing",
   4.271 -		     website : "nothing" };
   4.272 -
   4.273 -	var check_text = (function (var_name) {
   4.274 -            var draw = draw_card(display);
   4.275 -	    if (state[deref(var_name)] !== (card[deref(var_name)]).text){
   4.276 -		if (draw[order.style][deref(var_name)]) {
   4.277 -		    card[deref(var_name)].ref.remove();
   4.278 -	    	    card[var_name].ref = 
   4.279 -	     		draw[order.style][deref(var_name)](
   4.280 -			    card[deref(var_name)].text,display);
   4.281 -	     	    state[deref(var_name)] = card[deref(var_name)].text;
   4.282 -		}}});
   4.283 -	
   4.284 -	return (function (){
   4.285 -	    check_text("name");
   4.286 -	    check_text("phone");
   4.287 -	    check_text("email");
   4.288 -	    check_text("occupation");
   4.289 -	    check_text("company");
   4.290 -	    check_text("website");
   4.291 -	    
   4.292 -	    $("#debug").html(JSON.stringify(state));
   4.293 -	});
   4.294 -    
   4.295 -    })();
   4.296 -      
   4.297 -    var update = (function (){
   4.298 -	color_select_update();
   4.299 -	display_color_update();
   4.300 -	display_text_update();
   4.301 -	display_style_update();
   4.302 -    });
   4.303 -    
   4.304 -
   4.305 -    return {init : init,
   4.306 -	    update : update};})(); 
   4.307 -
   4.308 -
   4.309 -
   4.310 -$(document).ready(function() {
   4.311 -    Buy.init();
   4.312 -    Buy.update();
   4.313 -    });
     5.1 --- a/temp342423/kill-comments	Tue Jul 27 22:23:13 2010 -0400
     5.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     5.3 @@ -1,28 +0,0 @@
     5.4 -#!/usr/bin/python
     5.5 -
     5.6 -import subprocess
     5.7 -import sys
     5.8 -import os
     5.9 -
    5.10 -target_file = sys.argv[1]
    5.11 -
    5.12 -command =   "emacs -batch -l ~/.emacs-bash " + \
    5.13 -    target_file + \
    5.14 -    " --eval '(kill-comment (count-lines (point-min) (point-max)))'"
    5.15 -
    5.16 -#to load a custom .emacs script (for more syntax support),
    5.17 -#use -l <file> in the above command
    5.18 -
    5.19 -#print command
    5.20 -
    5.21 -fnull = open(os.devnull, 'w')
    5.22 -result = subprocess.call(command, shell = True, stdout = fnull, stderr = fnull)
    5.23 -fnull.close()
    5.24 -
    5.25 -
    5.26 -
    5.27 -
    5.28 -
    5.29 -
    5.30 -
    5.31 -
     6.1 --- a/temp342423/server.clj	Tue Jul 27 22:23:13 2010 -0400
     6.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     6.3 @@ -1,27 +0,0 @@
     6.4 -(ns laserkard.server
     6.5 -  (:use (compojure.http request servlet session routes)
     6.6 -	(compojure.server jetty)
     6.7 -	(compojure control)
     6.8 -	(laserkard buy-temp faq)
     6.9 -
    6.10 -))
    6.11 -
    6.12 -(defroutes example
    6.13 -  (GET "/index.clj" [] "<h1> hello, connie, good to meet you</h1>")
    6.14 -  (GET "/buy-temp.clj" [] (buy-gen))
    6.15 -  (GET "/faq.clj" [] (faq))
    6.16 -)
    6.17 -
    6.18 -
    6.19 -
    6.20 -(defserver laserkard-server
    6.21 -  {:port 9000 :host "localhost"}
    6.22 -  "/*" (servlet example))
    6.23 -
    6.24 -
    6.25 -					;adasdas
    6.26 -
    6.27 -;asdas
    6.28 -
    6.29 -
    6.30 -