diff js-lib/buy3.js @ 99:9649b14f3b38 laserkard

made main drawing function capable of rendering style selection boxes. no more pics needed
author Robert McIntyre <rlm@mit.edu>
date Tue, 27 Jul 2010 07:56:22 -0400
parents 388344355ebf
children 595866daadbe
line wrap: on
line diff
     1.1 --- a/js-lib/buy3.js	Tue Jul 27 05:14:22 2010 -0400
     1.2 +++ b/js-lib/buy3.js	Tue Jul 27 07:56:22 2010 -0400
     1.3 @@ -3,16 +3,32 @@
     1.4  
     1.5      //Cards drawing functions:
     1.6  
     1.7 -    var Cards = 
     1.8 -	{"bold" : {
     1.9 -	    "name" :(function (text, display){
    1.10 -		return display.print(10,20,text,helvetica, 25).attr(
    1.11 -		    {"fill" : "#0F0"});}),
    1.12 -	    "email" : (function (text, paper){
    1.13 -		return paper.print(50,50,text,helvetica_I,40).attr(
    1.14 -		    {"fill" : "red"});})}
    1.15 +    var magic_font_ratio = 318; //the font size for identity under .scale(1,1) 
    1.16 +    var mfg = magic_font_ratio;
    1.17 +    
    1.18  
    1.19 +
    1.20 +    var draw_card = (function (paper){
    1.21 +	
    1.22 +	var helvetica  = paper.getFont('HelveticaNeue', 700);
    1.23 +	var helveticaI = paper.getFont('HelveticaNeue', 800);
    1.24 +	var h = paper.height;
    1.25 +	var w = paper.width;
    1.26 +
    1.27 +	return {
    1.28 +	    "bold" : {
    1.29 +		"name" :(function (text){
    1.30 +		    return paper.print(w*0.1,h*0.2,text,helvetica).attr(
    1.31 +			{"fill" : "#0F0"}).scale(0.0002*h,0.00025*w,w*0.1,h*0.2);}),
    1.32 +		"email" : (function (text){
    1.33 +		    return paper.print(w*0.1,h*0.4,text,helveticaI).attr(
    1.34 +			{"fill" : "red"}).scale(0.0002*h,0.00025*w,w*0.1,h*0.4);})}
    1.35  	};
    1.36 +	
    1.37 +    });
    1.38 +
    1.39 +
    1.40 +
    1.41  
    1.42  
    1.43  
    1.44 @@ -74,7 +90,8 @@
    1.45      var helvetica_I;
    1.46  
    1.47      var state_map = {
    1.48 -    	bold  : {ref : null},
    1.49 +    	bold  : null,
    1.50 +	classic : null,
    1.51  	
    1.52  	green : {ref : null, 
    1.53      		 offState : {"fill" : "#030", "scale": 1} , 
    1.54 @@ -108,7 +125,8 @@
    1.55      
    1.56      var display_init = (function (){
    1.57      	state_map["display"].ref = 
    1.58 -    	    display.rect(1, 1, 338, 213, 20).attr(state_map["display"].state);
    1.59 +    	    display.rect(1, 1 , display.width - 1, display.height - 2, 20).attr(
    1.60 +		state_map["display"].state);
    1.61      });
    1.62      
    1.63      var text_entry_init = (function (){
    1.64 @@ -124,20 +142,26 @@
    1.65  		if ($(this).val() == $(this).attr('title')){
    1.66  		    $(this).val('');}})})});
    1.67  
    1.68 -    
    1.69 +    var style_text = {
    1.70 +	phone : "617.821.9129",
    1.71 +	email : "rlm@mit.edu",
    1.72 +	website : "www.rlmcintyre.com",
    1.73 +	name : "Robert McIntyre",
    1.74 +	company : "LaserKard LLC.",
    1.75 +	occupation : "AI Researcher"}
    1.76  
    1.77  
    1.78      var style_init = (function (){
    1.79 -	state_map["bold"] = style.bold.set();
    1.80 -	//var yyy = Cards.bold.name("Ru", style.bold);
    1.81 -	
    1.82 -	//for each (var item in yyy.items) {item.scale(0.5, 0.5);}
    1.83 -//	for (var letter in yyy) {
    1.84 -//		letter.scale(0.5,0.5);}
    1.85 -	
    1.86 -	state_map["bold"].push(Cards.bold.name("Robert", style.bold));
    1.87 -	state_map["bold"].attr({"fill" : "red"}); //.scale(0.5, 0.5, 0, 0);
    1.88 -	state_map["bold"].scale(0.03, 0.03, 0 , 0);
    1.89 +	var draw = draw_card(style.bold);
    1.90 +	draw.bold.name(style_text.name);
    1.91 +	style.bold.rect(1, 1 ,style.bold.width - 1, style.bold.height - 2, 10);
    1.92 +	draw.bold.email(style_text.email);
    1.93 +	// state_map["bold"] = style.bold.set();
    1.94 +	// state_map["bold"].push(Cards.bold.name(style_text.name, style.bold));
    1.95 +	// state_map["bold"].push(Cards.bold.email(style_text.email, style.bold));
    1.96 +	// 
    1.97 +	// state_map["bold"].attr({"fill" : "red"}); 
    1.98 +	// state_map["bold"].scale(0.03, 0.03, 0 , 0);
    1.99  
   1.100      });
   1.101  
   1.102 @@ -147,8 +171,11 @@
   1.103      var init = (function () {
   1.104  	display = Raphael("card-display", 340 ,215);
   1.105  	color = Raphael("color-select", 300, 100);
   1.106 -	style.bold = Raphael("bold", 100, 100);
   1.107 -	//style = Raphael("style-select", 200, 70);
   1.108 +	
   1.109 +	style.bold = Raphael("bold", 170, 107);
   1.110 +
   1.111 +	style.classic = Raphael("classic", 170 , 107);
   1.112 +	
   1.113  	helvetica = display.getFont('HelveticaNeue', 700);
   1.114  	helvetica_I = display.getFont('HelveticaNeue', 800);
   1.115  	color_select_init();
   1.116 @@ -213,10 +240,12 @@
   1.117  
   1.118      var display_style_update = (function (){
   1.119  	var style = null;
   1.120 +	
   1.121  	return (function () {
   1.122 +	    var draw = draw_card(display);
   1.123  	    if (style !== order.style){
   1.124  		for ( var property in card ){
   1.125 -		    if (!Cards[order.style][(deref(property))]){
   1.126 +		    if (!draw[order.style][(deref(property))]){
   1.127  			$("#user" + "-" + property).toggle(400);}}
   1.128  		style = order.style;}	
   1.129  	});})();
   1.130 @@ -229,12 +258,13 @@
   1.131  		     company : "nothing",
   1.132  		     website : "nothing" };
   1.133  
   1.134 -	var check_text = (function (var_name) {                         
   1.135 +	var check_text = (function (var_name) {
   1.136 +            var draw = draw_card(display);
   1.137  	    if (state[deref(var_name)] !== (card[deref(var_name)]).text){
   1.138 -		if (Cards[order.style][deref(var_name)]) {
   1.139 +		if (draw[order.style][deref(var_name)]) {
   1.140  		    card[deref(var_name)].ref.remove();
   1.141  	    	    card[var_name].ref = 
   1.142 -	     		Cards[order.style][deref(var_name)](
   1.143 +	     		draw[order.style][deref(var_name)](
   1.144  			    card[deref(var_name)].text,display);
   1.145  	     	    state[deref(var_name)] = card[deref(var_name)].text;
   1.146  		}}});