Mercurial > laserkard
comparison js-lib/buy3.js @ 99:9649b14f3b38 laserkard
made main drawing function capable of rendering style selection boxes. no more pics needed
author | Robert McIntyre <rlm@mit.edu> |
---|---|
date | Tue, 27 Jul 2010 07:56:22 -0400 |
parents | 388344355ebf |
children | 595866daadbe |
comparison
equal
deleted
inserted
replaced
98:388344355ebf | 99:9649b14f3b38 |
---|---|
1 | 1 |
2 Buy = (function (){ | 2 Buy = (function (){ |
3 | 3 |
4 //Cards drawing functions: | 4 //Cards drawing functions: |
5 | 5 |
6 var Cards = | 6 var magic_font_ratio = 318; //the font size for identity under .scale(1,1) |
7 {"bold" : { | 7 var mfg = magic_font_ratio; |
8 "name" :(function (text, display){ | 8 |
9 return display.print(10,20,text,helvetica, 25).attr( | 9 |
10 {"fill" : "#0F0"});}), | 10 |
11 "email" : (function (text, paper){ | 11 var draw_card = (function (paper){ |
12 return paper.print(50,50,text,helvetica_I,40).attr( | 12 |
13 {"fill" : "red"});})} | 13 var helvetica = paper.getFont('HelveticaNeue', 700); |
14 | 14 var helveticaI = paper.getFont('HelveticaNeue', 800); |
15 var h = paper.height; | |
16 var w = paper.width; | |
17 | |
18 return { | |
19 "bold" : { | |
20 "name" :(function (text){ | |
21 return paper.print(w*0.1,h*0.2,text,helvetica).attr( | |
22 {"fill" : "#0F0"}).scale(0.0002*h,0.00025*w,w*0.1,h*0.2);}), | |
23 "email" : (function (text){ | |
24 return paper.print(w*0.1,h*0.4,text,helveticaI).attr( | |
25 {"fill" : "red"}).scale(0.0002*h,0.00025*w,w*0.1,h*0.4);})} | |
15 }; | 26 }; |
27 | |
28 }); | |
29 | |
30 | |
31 | |
16 | 32 |
17 | 33 |
18 | 34 |
19 | 35 |
20 | 36 |
72 var style = {}; | 88 var style = {}; |
73 var helvetica; | 89 var helvetica; |
74 var helvetica_I; | 90 var helvetica_I; |
75 | 91 |
76 var state_map = { | 92 var state_map = { |
77 bold : {ref : null}, | 93 bold : null, |
94 classic : null, | |
78 | 95 |
79 green : {ref : null, | 96 green : {ref : null, |
80 offState : {"fill" : "#030", "scale": 1} , | 97 offState : {"fill" : "#030", "scale": 1} , |
81 onState : {"fill" : "#0F0", "scale": 1}}, | 98 onState : {"fill" : "#0F0", "scale": 1}}, |
82 red : {ref : null, | 99 red : {ref : null, |
106 toggle_on(state_map[order.color]); | 123 toggle_on(state_map[order.color]); |
107 }); | 124 }); |
108 | 125 |
109 var display_init = (function (){ | 126 var display_init = (function (){ |
110 state_map["display"].ref = | 127 state_map["display"].ref = |
111 display.rect(1, 1, 338, 213, 20).attr(state_map["display"].state); | 128 display.rect(1, 1 , display.width - 1, display.height - 2, 20).attr( |
129 state_map["display"].state); | |
112 }); | 130 }); |
113 | 131 |
114 var text_entry_init = (function (){ | 132 var text_entry_init = (function (){ |
115 $('input[type=text][title!=""]').each(function() { | 133 $('input[type=text][title!=""]').each(function() { |
116 if ($.trim($(this).val()) == ''){ | 134 if ($.trim($(this).val()) == ''){ |
122 $('form').submit(function() { | 140 $('form').submit(function() { |
123 $(this).find('input[type=text][title!=""]').each(function() { | 141 $(this).find('input[type=text][title!=""]').each(function() { |
124 if ($(this).val() == $(this).attr('title')){ | 142 if ($(this).val() == $(this).attr('title')){ |
125 $(this).val('');}})})}); | 143 $(this).val('');}})})}); |
126 | 144 |
127 | 145 var style_text = { |
146 phone : "617.821.9129", | |
147 email : "rlm@mit.edu", | |
148 website : "www.rlmcintyre.com", | |
149 name : "Robert McIntyre", | |
150 company : "LaserKard LLC.", | |
151 occupation : "AI Researcher"} | |
128 | 152 |
129 | 153 |
130 var style_init = (function (){ | 154 var style_init = (function (){ |
131 state_map["bold"] = style.bold.set(); | 155 var draw = draw_card(style.bold); |
132 //var yyy = Cards.bold.name("Ru", style.bold); | 156 draw.bold.name(style_text.name); |
133 | 157 style.bold.rect(1, 1 ,style.bold.width - 1, style.bold.height - 2, 10); |
134 //for each (var item in yyy.items) {item.scale(0.5, 0.5);} | 158 draw.bold.email(style_text.email); |
135 // for (var letter in yyy) { | 159 // state_map["bold"] = style.bold.set(); |
136 // letter.scale(0.5,0.5);} | 160 // state_map["bold"].push(Cards.bold.name(style_text.name, style.bold)); |
137 | 161 // state_map["bold"].push(Cards.bold.email(style_text.email, style.bold)); |
138 state_map["bold"].push(Cards.bold.name("Robert", style.bold)); | 162 // |
139 state_map["bold"].attr({"fill" : "red"}); //.scale(0.5, 0.5, 0, 0); | 163 // state_map["bold"].attr({"fill" : "red"}); |
140 state_map["bold"].scale(0.03, 0.03, 0 , 0); | 164 // state_map["bold"].scale(0.03, 0.03, 0 , 0); |
141 | 165 |
142 }); | 166 }); |
143 | 167 |
144 | 168 |
145 | 169 |
146 | 170 |
147 var init = (function () { | 171 var init = (function () { |
148 display = Raphael("card-display", 340 ,215); | 172 display = Raphael("card-display", 340 ,215); |
149 color = Raphael("color-select", 300, 100); | 173 color = Raphael("color-select", 300, 100); |
150 style.bold = Raphael("bold", 100, 100); | 174 |
151 //style = Raphael("style-select", 200, 70); | 175 style.bold = Raphael("bold", 170, 107); |
176 | |
177 style.classic = Raphael("classic", 170 , 107); | |
178 | |
152 helvetica = display.getFont('HelveticaNeue', 700); | 179 helvetica = display.getFont('HelveticaNeue', 700); |
153 helvetica_I = display.getFont('HelveticaNeue', 800); | 180 helvetica_I = display.getFont('HelveticaNeue', 800); |
154 color_select_init(); | 181 color_select_init(); |
155 display_init(); | 182 display_init(); |
156 card_init(); | 183 card_init(); |
211 assoc('#user-website', card.website); | 238 assoc('#user-website', card.website); |
212 }); | 239 }); |
213 | 240 |
214 var display_style_update = (function (){ | 241 var display_style_update = (function (){ |
215 var style = null; | 242 var style = null; |
243 | |
216 return (function () { | 244 return (function () { |
245 var draw = draw_card(display); | |
217 if (style !== order.style){ | 246 if (style !== order.style){ |
218 for ( var property in card ){ | 247 for ( var property in card ){ |
219 if (!Cards[order.style][(deref(property))]){ | 248 if (!draw[order.style][(deref(property))]){ |
220 $("#user" + "-" + property).toggle(400);}} | 249 $("#user" + "-" + property).toggle(400);}} |
221 style = order.style;} | 250 style = order.style;} |
222 });})(); | 251 });})(); |
223 | 252 |
224 var display_text_update = (function (){ | 253 var display_text_update = (function (){ |
227 email: "nothing", | 256 email: "nothing", |
228 occupation: "nothing", | 257 occupation: "nothing", |
229 company : "nothing", | 258 company : "nothing", |
230 website : "nothing" }; | 259 website : "nothing" }; |
231 | 260 |
232 var check_text = (function (var_name) { | 261 var check_text = (function (var_name) { |
262 var draw = draw_card(display); | |
233 if (state[deref(var_name)] !== (card[deref(var_name)]).text){ | 263 if (state[deref(var_name)] !== (card[deref(var_name)]).text){ |
234 if (Cards[order.style][deref(var_name)]) { | 264 if (draw[order.style][deref(var_name)]) { |
235 card[deref(var_name)].ref.remove(); | 265 card[deref(var_name)].ref.remove(); |
236 card[var_name].ref = | 266 card[var_name].ref = |
237 Cards[order.style][deref(var_name)]( | 267 draw[order.style][deref(var_name)]( |
238 card[deref(var_name)].text,display); | 268 card[deref(var_name)].text,display); |
239 state[deref(var_name)] = card[deref(var_name)].text; | 269 state[deref(var_name)] = card[deref(var_name)].text; |
240 }}}); | 270 }}}); |
241 | 271 |
242 return (function (){ | 272 return (function (){ |