|
rlm@85
|
1 Buy = (function (){
|
|
rlm@85
|
2 var order =
|
|
rlm@86
|
3 {color: "red",
|
|
rlm@86
|
4 style: "bold",
|
|
rlm@86
|
5 quantity: 30,
|
|
rlm@86
|
6 content: undefined,
|
|
rlm@86
|
7 info: undefined};
|
|
rlm@85
|
8
|
|
rlm@85
|
9 var display;
|
|
rlm@85
|
10 var color;
|
|
rlm@85
|
11 var style;
|
|
rlm@85
|
12
|
|
rlm@86
|
13 // var select_green;
|
|
rlm@86
|
14 //var select_red;
|
|
rlm@86
|
15 //var select_blue;
|
|
rlm@86
|
16 //var select_black;
|
|
rlm@86
|
17
|
|
rlm@86
|
18 var select_map =
|
|
rlm@87
|
19 {green : {offAttr : 0, onAttr : 0, ref : 0},
|
|
rlm@87
|
20 red : {offAttr : 0, onAttr : 0, ref : 0},
|
|
rlm@87
|
21 blue : {offAttr : 0, onAttr : 0, ref : 0},
|
|
rlm@87
|
22 green : {offAttr : 0, onAttr : 0, ref : 0}};
|
|
rlm@86
|
23
|
|
rlm@86
|
24 var toggle_on = (function (button){
|
|
rlm@87
|
25 button.ref.animate(button.onAttr, 500);
|
|
rlm@86
|
26 });
|
|
rlm@86
|
27
|
|
rlm@86
|
28 var toggle_off = (function (button){
|
|
rlm@87
|
29 button.ref.animate(button.offAttr, 500);
|
|
rlm@86
|
30 });
|
|
rlm@86
|
31
|
|
rlm@86
|
32 var color_update = (function (){
|
|
rlm@86
|
33 var color = order.color;
|
|
rlm@86
|
34 return (function (){
|
|
rlm@86
|
35 if (order.color === color){}
|
|
rlm@86
|
36 else {
|
|
rlm@86
|
37 toggle_off(select_map[color]);
|
|
rlm@86
|
38 toggle_on(select_map[(order.color)]);
|
|
rlm@86
|
39 color = order.color;}
|
|
rlm@86
|
40 });})();
|
|
rlm@86
|
41
|
|
rlm@86
|
42 var update = (function (){
|
|
rlm@86
|
43 color_update();});
|
|
rlm@86
|
44
|
|
rlm@85
|
45 var drawInit = (function (){
|
|
rlm@86
|
46 //color-select init
|
|
rlm@87
|
47 select_map["red"].onAttr = {"fill" : "#F00"};
|
|
rlm@87
|
48 select_map["red"].offAttr = {"fill" : "#300"};
|
|
rlm@87
|
49 select_map["red"].ref =
|
|
rlm@87
|
50 color.rect(1, 1, 70, 50, 10).attr(select_map["red"].offAttr);
|
|
rlm@87
|
51 select_map["red"].ref.node.onclick =
|
|
rlm@87
|
52 (function (){order.color= "red"; update();});
|
|
rlm@87
|
53
|
|
rlm@87
|
54 select_map["green"].onAttr = {"fill" : "#0F0"};
|
|
rlm@87
|
55 select_map["green"].offAttr = {"fill" : "#030"};
|
|
rlm@87
|
56 select_map["green"].ref =
|
|
rlm@87
|
57 color.rect(80, 1, 70, 50, 10).attr(select_map["green"].offAttr);
|
|
rlm@87
|
58 select_map["green"].ref.node.onclick =
|
|
rlm@87
|
59 (function (){order.color= "green"; update();});
|
|
rlm@87
|
60
|
|
rlm@87
|
61 select_map["blue"].onAttr = {"fill" : "#00F"};
|
|
rlm@87
|
62 select_map["blue"].offAttr = {"fill" : "#003"};
|
|
rlm@87
|
63 select_map["blue"].ref =
|
|
rlm@87
|
64 color.rect(160, 1, 70, 50, 10).attr(select_map["blue"].offAttr);
|
|
rlm@87
|
65 select_map["blue"].ref.node.onclick =
|
|
rlm@87
|
66 (function (){order.color= "blue"; update();});
|
|
rlm@87
|
67
|
|
rlm@86
|
68
|
|
rlm@86
|
69 toggle_on(select_map[order.color]);
|
|
rlm@86
|
70
|
|
rlm@86
|
71 display.rect(1, 1, 338, 213, 20);
|
|
rlm@86
|
72 style.rect(1, 1, 10, 10, 5);
|
|
rlm@86
|
73
|
|
rlm@86
|
74 display.print(40, 45, "Robert" , display.getFont('HelveticaNeue', 700), 30);
|
|
rlm@86
|
75 display.print(40, 90, "McIntyre" , display.getFont('HelveticaNeue', 800), 30);
|
|
rlm@86
|
76
|
|
rlm@86
|
77
|
|
rlm@85
|
78 });
|
|
rlm@85
|
79
|
|
rlm@85
|
80 var init = (function () {
|
|
rlm@85
|
81
|
|
rlm@85
|
82 $("#debug").append("init called.");
|
|
rlm@85
|
83 display = Raphael("card-display", 340 ,215);
|
|
rlm@86
|
84 color = Raphael("color-select", 300, 100);
|
|
rlm@85
|
85 style = Raphael("style-select", 200, 70);
|
|
rlm@85
|
86 drawInit();
|
|
rlm@85
|
87 });
|
|
rlm@85
|
88
|
|
rlm@85
|
89
|
|
rlm@85
|
90
|
|
rlm@86
|
91 return {init : init,
|
|
rlm@86
|
92 update : update};
|
|
rlm@85
|
93 })();
|
|
rlm@85
|
94
|
|
rlm@85
|
95
|
|
rlm@85
|
96
|
|
rlm@85
|
97 $(document).ready(function() {
|
|
rlm@85
|
98 Buy.init();
|
|
rlm@85
|
99
|
|
rlm@85
|
100
|
|
rlm@85
|
101
|
|
rlm@85
|
102
|
|
rlm@85
|
103 });
|
