1.1 --- a/js-lib/buy3.js	Mon Jul 26 05:45:51 2010 -0400
     1.2 +++ b/js-lib/buy3.js	Mon Jul 26 13:01:47 2010 -0400
     1.3 @@ -1,13 +1,49 @@
     1.4 +// Cards = (function (){
     1.5 +
     1.6 +    
     1.7 +//     (function (info paper){
     1.8 +// 	info.name
     1.9 +// 	info.occupation
    1.10 +// 	info.email
    1.11 +// 	info.phone
    1.12 +     
    1.13 +     
    1.14 +
    1.15 +
    1.16 +
    1.17 +
    1.18 +// });
    1.19 +
    1.20 +
    1.21 +
    1.22 +
    1.23  Buy = (function (){ 
    1.24 +    // Utility Functinos
    1.25  
    1.26 +    var switchText = (function (){
    1.27 +	if ($(this).val() == $(this).attr('title'))
    1.28 +	    $(this).val('').removeClass('exampleText');
    1.29 +	else if ($.trim($(this).val()) == '')
    1.30 +	    $(this).addClass('exampleText').val($(this).attr('title'));});
    1.31  
    1.32 -    //Initilization Functions.
    1.33 +
    1.34 +
    1.35 +
    1.36 +
    1.37 +    // Initilization Functions.
    1.38      var order = 
    1.39 -	{color: "red",
    1.40 -	 style: "bold",
    1.41 -	 quantity: 30,
    1.42 -	 content: undefined,
    1.43 -	 info: undefined};
    1.44 +	{color : "green",
    1.45 +	 style : "bold",
    1.46 +	 quantity : 30,
    1.47 +	 content : undefined,
    1.48 +	 info : undefined,
    1.49 +	 name : "Robert McIntyre",
    1.50 +	 occupation : "AI Researcher",
    1.51 +	 phone : "617.821.9129",
    1.52 +	 email : "rlm@mit.edu",
    1.53 +	 website : "www.rlmcintyre.com",
    1.54 +	 company : "LaserKard LLC." 
    1.55 +	};
    1.56      
    1.57      var display;
    1.58      var color;
    1.59 @@ -29,15 +65,15 @@
    1.60  
    1.61      var color_select_init = (function (){
    1.62  	state_map["red"].ref = 
    1.63 -	    color.rect(1, 1, 70, 50, 10).attr(state_map["red"].offState);
    1.64 +	    color.rect(160, 1, 70, 50, 10).attr(state_map["red"].offState);
    1.65  	state_map["red"].ref.node.onclick = 
    1.66  	    (function (){order.color= "red"; update();});
    1.67  	state_map["green"].ref = 
    1.68 -	    color.rect(80, 1, 70, 50, 10).attr(state_map["green"].offState);
    1.69 +	    color.rect(1, 1, 70, 50, 10).attr(state_map["green"].offState);
    1.70  	state_map["green"].ref.node.onclick = 
    1.71  	    (function (){order.color= "green"; update();});
    1.72  	state_map["blue"].ref = 
    1.73 -	    color.rect(160, 1, 70, 50, 10).attr(state_map["blue"].offState);
    1.74 +	    color.rect(80, 1, 70, 50, 10).attr(state_map["blue"].offState);
    1.75  	state_map["blue"].ref.node.onclick = 
    1.76  	    (function (){order.color= "blue"; update();});
    1.77  	
    1.78 @@ -48,6 +84,24 @@
    1.79      	state_map["display"].ref = 
    1.80      	    display.rect(1, 1, 338, 213, 20).attr(state_map["display"].state);
    1.81      });
    1.82 +    
    1.83 +    var text_entry_init = (function (){
    1.84 +	$('input[type=text][title!=""]').each(function() {
    1.85 +	    if ($.trim($(this).val()) == ''){
    1.86 +		$(this).val($(this).attr('title'));}
    1.87 +	    if ($(this).val() == $(this).attr('title')){
    1.88 +		$(this).addClass('exampleText');}
    1.89 +	}).focus(switchText).blur(switchText);
    1.90 +	
    1.91 +	$('form').submit(function() {
    1.92 +	    $(this).find('input[type=text][title!=""]').each(function() {
    1.93 +		if ($(this).val() == $(this).attr('title')){
    1.94 +		    $(this).val('');}})})});
    1.95 +
    1.96 +
    1.97 +    
    1.98 +    
    1.99 +
   1.100  
   1.101      var init = (function () {
   1.102  	display = Raphael("card-display", 340 ,215);
   1.103 @@ -55,6 +109,10 @@
   1.104  	style = Raphael("style-select", 200, 70);
   1.105  	color_select_init();
   1.106  	display_init();
   1.107 +	card_init();	
   1.108 +	text_entry_init();
   1.109 +	key_handling();
   1.110 +
   1.111      });
   1.112  
   1.113  	
   1.114 @@ -78,7 +136,7 @@
   1.115  		color = order.color;}
   1.116  	});})(); 
   1.117      
   1.118 -    var display_update = (function (){
   1.119 +    var display_color_update = (function (){
   1.120      	var color = state_map.display.state.fill 
   1.121  
   1.122      	return (function (){
   1.123 @@ -88,10 +146,89 @@
   1.124  		    {"fill" : state_map[order.color].onState.fill}, 2000);
   1.125      		color = order.color;}})})();
   1.126  
   1.127 +    
   1.128 +
   1.129 +    var display_style_update = (function (){
   1.130 +	var style = null;
   1.131 +	return (function (){
   1.132 +	    if (style !== order.style){
   1.133 +		""; }});
   1.134 +	});
   1.135 +
   1.136 +
   1.137 +    var card = 
   1.138 +	{name       : {text: "Robert McIntyre", ref: ""},
   1.139 +	 company    : {text: "", ref: ""},
   1.140 +	 occupation : {text: "", ref: ""},
   1.141 +	 phone      : {text: "", ref: ""},
   1.142 +	 email      : {text: "", ref: ""},
   1.143 +	 website    : {text: "", ref: ""},
   1.144 +	 decoration : {text: "", ref: ""}};
   1.145 +
   1.146 +    var card_init = (function () {
   1.147 +	card.name.ref = display.rect(10,10,10,10,5);
   1.148 +    });
   1.149 +
   1.150 +    var key_handling = (function (){
   1.151 +	var assoc = (function (target, field) {
   1.152 +	    $(target).keyup(function() {
   1.153 +		field.text = $(target).val();
   1.154 +		update();})});
   1.155 +	assoc('#user-name', card.name);
   1.156 +	assoc('#user-phone', card.phone);
   1.157 +	assoc('#user-email', card.email);
   1.158 +	assoc('#user-company', card.company);
   1.159 +	assoc('#user-occupation', card.occupation);
   1.160 +	assoc('#user-website', card.website);
   1.161 +
   1.162 +
   1.163 +});
   1.164 +
   1.165 +
   1.166 +    
   1.167 +    var display_text_update = (function (){
   1.168 +	var name = null;
   1.169 +
   1.170 +	return (function () {                         
   1.171 +
   1.172 +	    if (name !== card.name.text){
   1.173 +		//alert("whatev");
   1.174 +		card.name.ref.remove();
   1.175 +		card.name.ref = 
   1.176 +		    display.print(10,10,card.name.text,
   1.177 +				  display.getFont('HelveticaNeue',700), 25).attr(
   1.178 +				      {"fill" : "#FFFFFF"});
   1.179 +
   1.180 +		//card.name.ref.animate({"fill" : Raphael.getColor()} ,1000);
   1.181 +		name = card.name.text;
   1.182 +	    }});
   1.183 +	    
   1.184 +
   1.185 +    })();
   1.186 +      
   1.187 +    
   1.188 +
   1.189 +
   1.190 +    // var display_text_update = (function (){
   1.191 +    // 	var style;
   1.192 +    // 	var name;
   1.193 +    // 	var occupation;
   1.194 +    // 	var phone;
   1.195 +    // 	var email;
   1.196 +    // 	var company;
   1.197 +    // 	var website;
   1.198 +		
   1.199 +    // 	return (function (){
   1.200 +    // 	    if (style !== order.style) {}
   1.201 +	    
   1.202 +
   1.203 +    // })();
   1.204 +
   1.205      var update = (function (){
   1.206  	color_select_update();
   1.207 -	display_update();
   1.208 -	$("#debug").html(JSON.stringify(order));
   1.209 +	display_color_update();
   1.210 +	display_text_update();
   1.211 +	$("#debug").html(JSON.stringify({name : card.name.text, email : card.email.text}));
   1.212      });
   1.213      
   1.214      
   1.215 @@ -101,6 +238,13 @@
   1.216  	    update : update};})(); 
   1.217  
   1.218  
   1.219 +
   1.220 +
   1.221 +
   1.222 +
   1.223 +
   1.224 +
   1.225 +
   1.226  $(document).ready(function() {
   1.227      Buy.init();
   1.228      Buy.update();