Mercurial > laserkard

     1 Buy = (function (){ 

     2 

     3 

     4     //Initilization Functions.

     5     var order = 

     6 	{color: "red",

     7 	 style: "bold",

     8 	 quantity: 30,

     9 	 content: undefined,

    10 	 info: undefined};

    11     

    12     var display;

    13     var color;

    14     var style;

    15 

    16     var state_map = {

    17     	green : {ref : null, 

    18     		 offState : {"fill" : "#030", "scale": 1} , 

    19     		 onState :  {"fill" : "#0F0", "scale": 1}},

    20     	red  : {ref : null,

    21     		offState: {"fill" : "#300", "scale" : 1},

    22     		onState : {"fill" : "#F00" ,"scale" : 1}},

    23     	blue  : {ref : null,

    24     		 offState : {"fill" : "#003", "scale": 1}, 

    25     		 onState  : {"fill" : "#00F", "scale": 1}, 

    26     	    ref : null},

    27     	black : {offState : null, onState : null, ref : null},

    28     	display : {ref : null, state : {"fill" : "black"}}};

    29 

    30     var color_select_init = (function (){

    31 	state_map["red"].ref = 

    32 	    color.rect(1, 1, 70, 50, 10).attr(state_map["red"].offState);

    33 	state_map["red"].ref.node.onclick = 

    34 	    (function (){order.color= "red"; update();});

    35 	state_map["green"].ref = 

    36 	    color.rect(80, 1, 70, 50, 10).attr(state_map["green"].offState);

    37 	state_map["green"].ref.node.onclick = 

    38 	    (function (){order.color= "green"; update();});

    39 	state_map["blue"].ref = 

    40 	    color.rect(160, 1, 70, 50, 10).attr(state_map["blue"].offState);

    41 	state_map["blue"].ref.node.onclick = 

    42 	    (function (){order.color= "blue"; update();});

    43 	

    44 	toggle_on(state_map[order.color]);

    45     });

    46     

    47     var display_init = (function (){

    48     	state_map["display"].ref = 

    49     	    display.rect(1, 1, 338, 213, 20).attr(state_map["display"].state);

    50     });

    51 

    52     var init = (function () {

    53 	display = Raphael("card-display", 340 ,215);

    54 	color = Raphael("color-select", 300, 100);

    55 	style = Raphael("style-select", 200, 70);

    56 	color_select_init();

    57 	display_init();

    58     });

    59 

    60 	

    61     //Update Functions	    

    62     

    63     var toggle_on = (function (button){

    64 	button.ref.animate(button.onState, 2000);

    65     });

    66     

    67     var toggle_off = (function (button){

    68 	button.ref.animate(button.offState, 2000);

    69     });

    70     

    71     var color_select_update = (function (){

    72 	var color = order.color;

    73 	return (function (){

    74 	    if (order.color === color){}

    75 	    else {

    76 		toggle_off(state_map[color]);

    77 		toggle_on(state_map[(order.color)]);

    78 		color = order.color;}

    79 	});})(); 

    80     

    81     var display_update = (function (){

    82     	var color = state_map.display.state.fill 

    83 

    84     	return (function (){

    85     	    if (order.color === color){}

    86     	    else {

    87     		state_map["display"].ref.animate(

    88 		    {"fill" : state_map[order.color].onState.fill}, 2000);

    89     		color = order.color;}})})();

    90 

    91     var update = (function (){

    92 	color_select_update();

    93 	display_update();

    94 	$("#debug").html(JSON.stringify(order));

    95     });

    96     

    97     

    98     

    99     // return closure over state

   100     return {init : init,

   101 	    update : update};})(); 

   102 

   103 

   104 $(document).ready(function() {

   105     Buy.init();

   106     Buy.update();

   107     });
author	Robert McIntyre <rlm@mit.edu>
date	Mon, 26 Jul 2010 05:45:51 -0400
parents	08f93d043ed2
children	614dca52e323