Mercurial > laserkard

annotate js-lib/buy3.js @ 90:08f93d043ed2 laserkard

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
saving progress
author Robert McIntyre <rlm@mit.edu>
date Mon, 26 Jul 2010 04:13:05 -0400
parents 81deee1fc85b
children 0dd39631299c
rev   line source
rlm@85 1 Buy = (function (){
rlm@90 2
rlm@90 3
rlm@90 4 //Initilization Functions.
rlm@85 5 var order =
rlm@86 6 {color: "red",
rlm@86 7 style: "bold",
rlm@86 8 quantity: 30,
rlm@86 9 content: undefined,
rlm@86 10 info: undefined};
rlm@85 11
rlm@85 12 var display;
rlm@85 13 var color;
rlm@85 14 var style;
rlm@85 15
rlm@90 16 // var state_map =
rlm@90 17 // {green :{
rlm@90 18 // ref: null,
rlm@90 19 // offState : null,
rlm@90 20 // onState : null},
rlm@90 21 // red : {
rlm@90 22 // offState: {"fill" : "#300", "scale" : 1},
rlm@90 23 // onState : {"fill" : "#F00" ,"scale" : 1},
rlm@90 24 // ref : null},
rlm@90 25 // blue : {
rlm@90 26 // offState : null,
rlm@90 27 // onState : null,
rlm@90 28 // ref : null},
rlm@90 29 // black : {offState : null, onState : null, ref : null},
rlm@90 30 // display : {ref : null, state : {"fill" : "black"}}};
rlm@90 31
rlm@90 32 var state_map =
rlm@90 33 {green : { ref: null, offState : null, onState : null},
rlm@90 34 red : {
rlm@90 35 offState: {"fill" : "#300", "scale" : 1},
rlm@90 36 onState : {"fill" : "#F00" ,"scale" : 1},
rlm@90 37 ref : null},
rlm@90 38 blue : {
rlm@90 39 offState : null,
rlm@90 40 onState : null,
rlm@90 41 ref : null},
rlm@90 42 black : {offState : null, onState : null, ref : null},
rlm@90 43 display : {ref : null, state : {"fill" : "black"}}};
rlm@90 44
rlm@90 45 var color_select_init = (function (){
rlm@90 46 state_map["red"].ref =
rlm@90 47 color.rect(1, 1, 70, 50, 10).attr(state_map["red"].offState);
rlm@90 48 state_map["red"].ref.node.onclick =
rlm@90 49 (function (){order.color= "red"; update();});
rlm@90 50
rlm@90 51 state_map["green"].onState =
rlm@90 52 {"fill" : "#0F0", "scale": 1};
rlm@90 53 state_map["green"].offState =
rlm@90 54 {"fill" : "#030", "scale": 1};
rlm@90 55 state_map["green"].ref =
rlm@90 56 color.rect(80, 1, 70, 50, 10).attr(state_map["green"].offState);
rlm@90 57 state_map["green"].ref.node.onclick =
rlm@90 58 (function (){order.color= "green"; update();});
rlm@90 59
rlm@90 60 state_map["blue"].onState =
rlm@90 61 {"fill" : "#00F", "scale": 1};
rlm@90 62 state_map["blue"].offState =
rlm@90 63 {"fill" : "#003", "scale": 1};
rlm@90 64 state_map["blue"].ref =
rlm@90 65 color.rect(160, 1, 70, 50, 10).attr(state_map["blue"].offState);
rlm@90 66 state_map["blue"].ref.node.onclick =
rlm@90 67 (function (){order.color= "blue"; update();});
rlm@90 68
rlm@90 69
rlm@90 70 toggle_on(state_map[order.color]);
rlm@90 71 });
rlm@86 72
rlm@90 73 var display_init = (function (){
rlm@90 74 state_map["display"].state =
rlm@90 75 {"fill": "white"};
rlm@90 76 state_map["display"].ref =
rlm@90 77 display.rect(1, 1, 338, 213, 20).attr(state_map["display"].state);
rlm@90 78 });
rlm@90 79
rlm@90 80 var init = (function () {
rlm@90 81
rlm@90 82 display = Raphael("card-display", 340 ,215);
rlm@90 83 color = Raphael("color-select", 300, 100);
rlm@90 84 style = Raphael("style-select", 200, 70);
rlm@90 85 color_select_init();
rlm@90 86 display_init();
rlm@90 87 });
rlm@90 88
rlm@90 89
rlm@90 90 //Update Functions
rlm@86 91
rlm@86 92 var toggle_on = (function (button){
rlm@90 93 button.ref.animate(button.onState, 2000);
rlm@86 94 });
rlm@86 95
rlm@86 96 var toggle_off = (function (button){
rlm@90 97 button.ref.animate(button.offState, 2000);
rlm@86 98 });
rlm@86 99
rlm@90 100 var color_select_update = (function (){
rlm@86 101 var color = order.color;
rlm@86 102 return (function (){
rlm@86 103 if (order.color === color){}
rlm@86 104 else {
rlm@90 105 toggle_off(state_map[color]);
rlm@90 106 toggle_on(state_map[(order.color)]);
rlm@86 107 color = order.color;}
rlm@86 108 });})();
rlm@86 109
rlm@90 110 var display_update = (function (){
rlm@90 111 var color = state_map.display.state.fill
rlm@90 112
rlm@90 113 return (function (){
rlm@90 114 if (order.color === color){}
rlm@90 115 else {
rlm@90 116 state_map["display"].ref.animate({"fill" : order.color}, 2000);
rlm@90 117 color = order.color;}})})();
rlm@90 118
rlm@86 119 var update = (function (){
rlm@90 120 color_select_update();
rlm@90 121 display_update();
rlm@90 122 $("#debug").html(JSON.stringify(order));
rlm@90 123 });
rlm@86 124
rlm@85 125
rlm@85 126
rlm@90 127 // return closure over state
rlm@86 128 return {init : init,
rlm@90 129 update : update};})();
rlm@85 130
rlm@85 131
rlm@85 132 $(document).ready(function() {
rlm@90 133 Buy.init();
rlm@90 134 Buy.update();
rlm@85 135 });