diff temp342423/buy3.js @ 102:8ed3394e6b73 laserkard

wrote comment-killer
author Robert McIntyre <rlm@mit.edu>
date Tue, 27 Jul 2010 22:23:13 -0400
parents
children
line wrap: on
line diff
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/temp342423/buy3.js	Tue Jul 27 22:23:13 2010 -0400
     1.3 @@ -0,0 +1,310 @@
     1.4 +
     1.5 +Buy = (function (){ 
     1.6 +
     1.7 +
     1.8 +    
     1.9 +    var magic_font_ratio = 318;
    1.10 +    var mfg = magic_font_ratio;
    1.11 +    
    1.12 +
    1.13 +
    1.14 +    var draw_card = (function (paper){
    1.15 +	
    1.16 +	var helvetica  = paper.getFont('HelveticaNeue', 700);
    1.17 +	var helveticaI = paper.getFont('HelveticaNeue', 800);
    1.18 +	var h = paper.height;
    1.19 +	var w = paper.width;
    1.20 +
    1.21 +	var standard = (function (text, x, y, pt, font){
    1.22 +	    if (!font) {font = helvetica;}
    1.23 +	    var scale_x = 0.00030*h*pt/20;  
    1.24 +	    var scale_y = 0.00025*w*pt/20;
    1.25 +	    return paper.print(h*x, w*y,text, font).scale(
    1.26 +		scale_x,scale_y,h*x,w*y);});
    1.27 +
    1.28 +	var bold = {
    1.29 +	    "name" :(function (text){
    1.30 +		return standard(text, 0.2,0.1,20).attr({"fill" : "red"});}),
    1.31 +	    "email" : (function (text){
    1.32 +		return standard(text, 0.2,0.4,20,helveticaI).attr(
    1.33 +		    {"fill" : "red"});})};
    1.34 +	
    1.35 +	
    1.36 +	return {
    1.37 +	    "bold" : bold
    1.38 +	};
    1.39 +	
    1.40 +    });
    1.41 +
    1.42 +
    1.43 +
    1.44 +
    1.45 +
    1.46 +
    1.47 +    
    1.48 +
    1.49 +
    1.50 +
    1.51 +    
    1.52 +
    1.53 +
    1.54 +
    1.55 +
    1.56 +    var switchText = (function (){
    1.57 +	if ($(this).val() == $(this).attr('title'))
    1.58 +	    $(this).val('').removeClass('exampleText');
    1.59 +	else if ($.trim($(this).val()) == '')
    1.60 +	    $(this).addClass('exampleText').val($(this).attr('title'));});
    1.61 +
    1.62 +
    1.63 +    var deref = (function (var_name){return var_name;});
    1.64 +
    1.65 +
    1.66 +
    1.67 +
    1.68 +
    1.69 +    var card;
    1.70 +	
    1.71 +    var card_init = (function () {
    1.72 +	
    1.73 +	card = {
    1.74 +	    name       : {text: "Robert McIntyre", ref: display.set()},
    1.75 +	    company    : {text: "", ref: display.set()},
    1.76 +	    occupation : {text: "", ref: display.set()},
    1.77 +	    phone      : {text: "", ref: display.set()},
    1.78 +	    email      : {text: "rlm@mit.edu", ref: display.set()},
    1.79 +	    website    : {text: "", ref: display.set()},
    1.80 +	    decoration : {text: "", ref: display.set()}};
    1.81 +    });
    1.82 +
    1.83 +
    1.84 +    var order = 
    1.85 +	{color : "blue",
    1.86 +	 style : "bold",
    1.87 +	 quantity : 30,
    1.88 +	 content : undefined,
    1.89 +	 info : undefined,
    1.90 +	 name : "Robert McIntyre",
    1.91 +	 occupation : "AI Researcher",
    1.92 +	 phone : "617.821.9129",
    1.93 +	 email : "rlm@mit.edu",
    1.94 +	 website : "www.rlmcintyre.com",
    1.95 +	 company : "LaserKard LLC." 
    1.96 +	};
    1.97 +    
    1.98 +    var display;
    1.99 +    var color;
   1.100 +    var style = {};
   1.101 +    var helvetica;
   1.102 +    var helvetica_I;
   1.103 +
   1.104 +    var state_map = {
   1.105 +    	bold  : null,
   1.106 +	classic : null,
   1.107 +	
   1.108 +	green : {ref : null, 
   1.109 +    		 offState : {"fill" : "#030", "scale": 1} , 
   1.110 +    		 onState :  {"fill" : "#0F0", "scale": 1}},
   1.111 +    	red  : {ref : null,
   1.112 +    		offState: {"fill" : "#300", "scale" : 1},
   1.113 +    		onState : {"fill" : "#F00" ,"scale" : 1}},
   1.114 +    	blue  : {ref : null,
   1.115 +    		 offState : {"fill" : "#003", "scale": 1}, 
   1.116 +    		 onState  : {"fill" : "#00F", "scale": 1}, 
   1.117 +    	    ref : null},
   1.118 +    	black : {offState : null, onState : null, ref : null},
   1.119 +    	display : {ref : null, state : {"fill" : "black"}}};
   1.120 +
   1.121 +    var color_select_init = (function (){
   1.122 +	state_map["red"].ref = 
   1.123 +	    color.rect(160, 1, 70, 50, 10).attr(state_map["red"].offState);
   1.124 +	state_map["red"].ref.node.onclick = 
   1.125 +	    (function (){order.color= "red"; update();});
   1.126 +	state_map["green"].ref = 
   1.127 +	    color.rect(1, 1, 70, 50, 10).attr(state_map["green"].offState);
   1.128 +	state_map["green"].ref.node.onclick = 
   1.129 +	    (function (){order.color= "green"; update();});
   1.130 +	state_map["blue"].ref = 
   1.131 +	    color.rect(80, 1, 70, 50, 10).attr(state_map["blue"].offState);
   1.132 +	state_map["blue"].ref.node.onclick = 
   1.133 +	    (function (){order.color= "blue"; update();});
   1.134 +	
   1.135 +	toggle_on(state_map[order.color]);
   1.136 +    });
   1.137 +    
   1.138 +    var display_init = (function (){
   1.139 +    	state_map["display"].ref = 
   1.140 +    	    display.rect(1, 1 , display.width - 1, display.height - 2, 20).attr(
   1.141 +		state_map["display"].state);
   1.142 +    });
   1.143 +    
   1.144 +    var text_entry_init = (function (){
   1.145 +	$('input[type=text][title!=""]').each(function() {
   1.146 +	    if ($.trim($(this).val()) == ''){
   1.147 +		$(this).val($(this).attr('title'));}
   1.148 +	    if ($(this).val() == $(this).attr('title')){
   1.149 +		$(this).addClass('exampleText');}
   1.150 +	}).focus(switchText).blur(switchText);
   1.151 +	
   1.152 +	$('form').submit(function() {
   1.153 +	    $(this).find('input[type=text][title!=""]').each(function() {
   1.154 +		if ($(this).val() == $(this).attr('title')){
   1.155 +		    $(this).val('');}})})});
   1.156 +
   1.157 +    var style_text = {
   1.158 +	phone : "617.821.9129",
   1.159 +	email : "rlm@mit.edu",
   1.160 +	website : "www.rlmcintyre.com",
   1.161 +	name : "Robert McIntyre",
   1.162 +	company : "LaserKard LLC.",
   1.163 +	occupation : "AI Researcher"}
   1.164 +
   1.165 +
   1.166 +    var style_init = (function (){
   1.167 +	var draw = draw_card(style.bold);
   1.168 +	draw.bold.name(style_text.name);
   1.169 +	style.bold.rect(1, 1 ,style.bold.width - 1, style.bold.height - 2, 10);
   1.170 +	draw.bold.email(style_text.email);
   1.171 +
   1.172 +
   1.173 +
   1.174 +
   1.175 +
   1.176 +
   1.177 +	
   1.178 +    });
   1.179 +
   1.180 +    
   1.181 +
   1.182 +
   1.183 +    var init = (function () {
   1.184 +	display = Raphael("card-display", 340 ,215);
   1.185 +	color = Raphael("color-select", 300, 100);
   1.186 +	
   1.187 +	style.bold = Raphael("bold", 170, 107);
   1.188 +
   1.189 +	style.classic = Raphael("classic", 170 , 107);
   1.190 +	
   1.191 +	helvetica = display.getFont('HelveticaNeue', 700);
   1.192 +	helvetica_I = display.getFont('HelveticaNeue', 800);
   1.193 +	color_select_init();
   1.194 +	display_init();
   1.195 +	card_init();	
   1.196 +	text_entry_init();
   1.197 +	key_handling();
   1.198 +	style_init();
   1.199 +	update();
   1.200 +    });
   1.201 +
   1.202 +	
   1.203 +
   1.204 +    
   1.205 +    var toggle_on = (function (button){
   1.206 +	button.ref.animate(button.onState, 2000);
   1.207 +    });
   1.208 +    
   1.209 +    var toggle_off = (function (button){
   1.210 +	button.ref.animate(button.offState, 2000);
   1.211 +    });
   1.212 +    
   1.213 +    var color_select_update = (function (){
   1.214 +	var color = order.color;
   1.215 +	return (function (){
   1.216 +	    if (order.color === color){}
   1.217 +	    else {
   1.218 +		toggle_off(state_map[color]);
   1.219 +		toggle_on(state_map[(order.color)]);
   1.220 +		color = order.color;}
   1.221 +	});})(); 
   1.222 +    
   1.223 +    var display_color_update = (function (){
   1.224 +    	var color = state_map.display.state.fill 
   1.225 +
   1.226 +    	return (function (){
   1.227 +    	    if (order.color === color){}
   1.228 +    	    else {
   1.229 +    		state_map["display"].ref.animate(
   1.230 +		    {"fill" : state_map[order.color].onState.fill}, 2000);
   1.231 +    		color = order.color;}})})();
   1.232 +    
   1.233 +    var display_style_update = (function (){
   1.234 +	var style = null;
   1.235 +	return (function (){
   1.236 +	    if (style !== order.style){
   1.237 +		""; }});
   1.238 +	});
   1.239 +
   1.240 +    var key_handling = (function (){
   1.241 +	var assoc = (function (target, field) {
   1.242 +	    $(target).keyup(function() {
   1.243 +		field.text = $(target).val();
   1.244 +		update();})});
   1.245 +	assoc('#user-name', card.name);
   1.246 +	assoc('#user-phone', card.phone);
   1.247 +	assoc('#user-email', card.email);
   1.248 +	assoc('#user-company', card.company);
   1.249 +	assoc('#user-occupation', card.occupation);
   1.250 +	assoc('#user-website', card.website);
   1.251 +    });
   1.252 +
   1.253 +    var display_style_update = (function (){
   1.254 +	var style = null;
   1.255 +	
   1.256 +	return (function () {
   1.257 +	    var draw = draw_card(display);
   1.258 +	    if (style !== order.style){
   1.259 +		for ( var property in card ){
   1.260 +		    if (!draw[order.style][(deref(property))]){
   1.261 +			$("#user" + "-" + property).toggle(400);}}
   1.262 +		style = order.style;}	
   1.263 +	});})();
   1.264 +
   1.265 +    var display_text_update = (function (){
   1.266 +	var state = {name : "nothing",
   1.267 +		     phone: "nothing",
   1.268 +		     email: "nothing",
   1.269 +		     occupation: "nothing",
   1.270 +		     company : "nothing",
   1.271 +		     website : "nothing" };
   1.272 +
   1.273 +	var check_text = (function (var_name) {
   1.274 +            var draw = draw_card(display);
   1.275 +	    if (state[deref(var_name)] !== (card[deref(var_name)]).text){
   1.276 +		if (draw[order.style][deref(var_name)]) {
   1.277 +		    card[deref(var_name)].ref.remove();
   1.278 +	    	    card[var_name].ref = 
   1.279 +	     		draw[order.style][deref(var_name)](
   1.280 +			    card[deref(var_name)].text,display);
   1.281 +	     	    state[deref(var_name)] = card[deref(var_name)].text;
   1.282 +		}}});
   1.283 +	
   1.284 +	return (function (){
   1.285 +	    check_text("name");
   1.286 +	    check_text("phone");
   1.287 +	    check_text("email");
   1.288 +	    check_text("occupation");
   1.289 +	    check_text("company");
   1.290 +	    check_text("website");
   1.291 +	    
   1.292 +	    $("#debug").html(JSON.stringify(state));
   1.293 +	});
   1.294 +    
   1.295 +    })();
   1.296 +      
   1.297 +    var update = (function (){
   1.298 +	color_select_update();
   1.299 +	display_color_update();
   1.300 +	display_text_update();
   1.301 +	display_style_update();
   1.302 +    });
   1.303 +    
   1.304 +
   1.305 +    return {init : init,
   1.306 +	    update : update};})(); 
   1.307 +
   1.308 +
   1.309 +
   1.310 +$(document).ready(function() {
   1.311 +    Buy.init();
   1.312 +    Buy.update();
   1.313 +    });