annotate awesome_js/robert.js @ 87:81deee1fc85b laserkard

got pure raphael color selector working
author Robert McIntyre <rlm@mit.edu>
date Mon, 26 Jul 2010 02:20:29 -0400
parents 343dc947f999
children
rev   line source
rlm@29 1
rlm@47 2 descHash = new Object();
rlm@47 3
rlm@48 4 prevVal = "";
rlm@47 5
rlm@47 6
rlm@47 7
rlm@47 8 descHash.classic_acrylic_clear =
rlm@47 9 "<h1>The Classic LaserKard.</h1>Balanced and Complete. The original LaserKard. For those that wish to leave no stone unturned. It's all there.";
rlm@47 10
rlm@47 11 descHash.big_acrylic_clear =
rlm@47 12 "<h1>The Bold Kard.</h1>Austere and Iconic. For those that wish to leave an impression with the power of their name accompanied only by their main method of contact. Bold, period.";
rlm@47 13
rlm@47 14 descHash.basic_acrylic_clear =
rlm@47 15 "<h1>The Arrow Kard.</h1>Precise and Straightforward. For those that seek to make a statement while being clear and concise. Straight as an arrow.";
rlm@47 16
rlm@47 17 descHash.lines_acrylic_clear =
rlm@47 18 "<h1>The Direct Kard.</h1>Thorough and Distinct. For those that aim to demonstrate their professionalism with style. Push the envelope. Be Direct.";
rlm@47 19
rlm@51 20 color = 'fefefe';
rlm@47 21
rlm@47 22
rlm@47 23
rlm@47 24
rlm@47 25 function pokedex(target)
rlm@47 26 {
rlm@47 27
rlm@47 28
rlm@47 29 var description = eval ("descHash." + target);
rlm@47 30
rlm@47 31 document.getElementById('pokedex').innerHTML = description;
rlm@47 32
rlm@47 33 }
rlm@29 34
rlm@29 35
rlm@44 36
rlm@44 37 function stabForm(ID)
rlm@42 38 {
rlm@44 39 var JSONtext = document.getElementById('formValues').innerHTML;
rlm@44 40 var hash = new Object();
rlm@44 41 hash = eval('(' + JSONtext + ')');
rlm@44 42
rlm@44 43 propertyValue = document.getElementById(ID).value;
rlm@44 44 propertyName = ID;
rlm@44 45 propertyValue = escape(propertyValue);
rlm@44 46
rlm@44 47 eval("hash."+propertyName+"='"+propertyValue+"'");
rlm@42 48
rlm@44 49 var JSONtext = document.getElementById('formValues').innerHTML = JSON.stringify(hash);
rlm@44 50 }
rlm@44 51
rlm@44 52
rlm@44 53
rlm@44 54 function getPosition(style, field)
rlm@44 55 {
rlm@44 56
rlm@44 57 var cardType = eval ("laserkard." + style);
rlm@44 58
rlm@44 59
rlm@44 60 if ( eval("typeof cardType." + field + " != 'undefined'")) //shouldn't ever really matter
rlm@44 61 {
rlm@44 62 values = eval("cardType." + field);
rlm@44 63
rlm@44 64 if (typeof values.posx != 'undefined'){posx = values.posx;}
rlm@44 65 if (typeof values.posy != 'undefined'){posy = values.posy;}
rlm@44 66 if (typeof values.center != 'undefined'){center = values.center;}
rlm@44 67 if (typeof values.font != 'undefined'){font = values.font;}
rlm@48 68 if (typeof values.face != 'undefined'){face = values.face;}
rlm@48 69 if (typeof values.width != 'undefined'){width = values.width;}
rlm@44 70 if (typeof values.weirdFlip != 'undefined'){weirdFlip = values.weirdFlip;}
rlm@48 71 if (typeof values.resize != 'undefined'){resize = values.resize;}
rlm@44 72 }
rlm@44 73
rlm@44 74
rlm@44 75 }
rlm@44 76
rlm@44 77
rlm@44 78
rlm@44 79 function smallRedraw(style,field)
rlm@44 80 {
rlm@51 81
rlm@79 82 var JSONtext = document.getElementById('formValues').innerHTML;
rlm@79 83 var hash = new Object();
rlm@79 84 hash = eval('(' + JSONtext + ')');
rlm@79 85
rlm@79 86 var content = eval("hash."+field);
rlm@79 87
rlm@79 88 content = unescape(content);
rlm@79 89
rlm@44 90
rlm@79 91 contentRedraw(style,field, content);
rlm@51 92 }
rlm@51 93
rlm@51 94
rlm@51 95
rlm@51 96 function contentRedraw(style,field, content)
rlm@51 97 {
rlm@51 98
rlm@51 99 //var color = color;
rlm@51 100
rlm@51 101
rlm@51 102
rlm@48 103
rlm@44 104 posx = 10;
rlm@44 105 posy = 10;
rlm@44 106 center = 0;
rlm@44 107 font = 10;
rlm@44 108 face = 700;
rlm@44 109 weirdFlip = 0;
rlm@48 110 resize = 1;
rlm@48 111 width = 450;
rlm@44 112
rlm@44 113 getPosition(style, field);
rlm@44 114
rlm@48 115
rlm@48 116
rlm@48 117
rlm@44 118 target = "d_" + field;
rlm@44 119
rlm@44 120
rlm@44 121 var whatev = eval("typeof " + target + " != 'undefined'")
rlm@44 122
rlm@44 123 if (whatev){eval ("{" + target + ".remove();}");}
rlm@44 124
rlm@44 125 eval ( target + " = raphe.print(posx, posy, content , raphe.getFont('HelveticaNeue', face), font);" );
rlm@44 126
rlm@48 127
rlm@48 128 var sizzle = eval(target+".getBBox().width;");
rlm@48 129
rlm@48 130 document.getElementById('output').innerHTML = sizzle;
rlm@48 131
rlm@48 132
rlm@48 133 if (resize == 1)
rlm@48 134
rlm@48 135 {
rlm@48 136
rlm@48 137
rlm@48 138
rlm@48 139
rlm@48 140 //base case
rlm@48 141 if ((sizzle) > width)
rlm@48 142 {
rlm@48 143
rlm@48 144 mul = .9;
rlm@48 145
rlm@48 146
rlm@48 147 mul = (width/sizzle);
rlm@48 148
rlm@48 149
rlm@48 150 font = font * mul;
rlm@48 151
rlm@48 152 //eval( target + ".scale(mul,mul)" );
rlm@48 153
rlm@48 154 eval ( target + ".remove();");
rlm@56 155 eval ( target + " = raphe.print(posx, posy, content , raphe.getFont('HelveticaNeue', face), font);" );
rlm@48 156
rlm@48 157
rlm@48 158 }
rlm@48 159
rlm@48 160
rlm@48 161
rlm@48 162 }
rlm@61 163
rlm@61 164
rlm@61 165 var targetFont = 2.3 *font/385.16 + 2.3*0.311;
rlm@61 166
rlm@61 167 if (font <25)
rlm@61 168 {
rlm@61 169
rlm@61 170 targetFont = targetFont * 0.75;
rlm@61 171
rlm@61 172 }
rlm@61 173
rlm@61 174
rlm@61 175 eval ( target +".attr('stroke-width', targetFont);");
rlm@56 176 //eval ( target +".attr('stroke-width', font/385.16 + 0.311);");
rlm@48 177
rlm@48 178 var sizzle = eval(target+".getBBox().width;");
rlm@48 179
rlm@48 180 document.getElementById('output').innerHTML = sizzle;
rlm@48 181
rlm@51 182 eval ( target +".attr('stroke', '#" + color + "');");
rlm@48 183 //eval ( target +".attr('stroke', '#fbafcd');");
rlm@48 184
rlm@76 185 eval ( target +".attr('fill', '#" + color + "');");
rlm@44 186
rlm@44 187
rlm@48 188
rlm@48 189
rlm@44 190 if (center == 1)
rlm@44 191 {
rlm@44 192 eval ("var c = " + target+".getBBox().width; " + target + ".translate((485 - c)/2,0);");
rlm@44 193 }
rlm@44 194
rlm@44 195
rlm@44 196 if (weirdFlip == 1)
rlm@44 197 {
rlm@44 198 eval("var c = "+target+".getBBox().width;");
rlm@44 199 eval(target+ ".translate((317 - c)/2,0);");
rlm@44 200 eval(target+".translate(0, -490);");
rlm@44 201 eval(target+".rotate(90,0,0);");
rlm@44 202 }
rlm@44 203
rlm@44 204
rlm@44 205
rlm@48 206 prevVal = content;
rlm@48 207
rlm@44 208
rlm@44 209
rlm@44 210 }
rlm@44 211
rlm@44 212 function clearAll()
rlm@44 213 {
rlm@44 214 if(typeof d_Name != 'undefined' ){d_Name.remove();}
rlm@44 215 if(typeof d_Company != 'undefined' ){d_Company.remove();}
rlm@44 216 if(typeof d_Email != 'undefined' ){d_Email.remove();}
rlm@44 217 if(typeof d_Occupation != 'undefined' ){d_Occupation.remove();}
rlm@44 218 if(typeof d_Phone != 'undefined' ){d_Phone.remove();}
rlm@44 219 if(typeof d_Website != 'undefined' ){d_Website.remove();}
rlm@44 220
rlm@44 221 if(typeof d_lineArt != 'undefined' ){d_lineArt.remove();}
rlm@42 222 }
rlm@42 223
rlm@51 224
rlm@51 225 function lineDraw(style, color)
rlm@51 226 {
rlm@51 227
rlm@51 228
rlm@51 229
rlm@51 230
rlm@51 231
rlm@51 232 if (style == "bold")
rlm@51 233 {return;}
rlm@51 234
rlm@51 235
rlm@51 236
rlm@51 237 if (style == "arrow")
rlm@51 238 {
rlm@51 239 d_lineArt = raphe.path("M 4 272 L 258 272");
rlm@51 240 d_lineArt.attr('stroke', "#" + color);
rlm@51 241 return;
rlm@51 242 }
rlm@51 243
rlm@51 244
rlm@51 245 if (style == "classic")
rlm@51 246 {return;}
rlm@51 247
rlm@51 248
rlm@51 249 if (style == "direct")
rlm@51 250 {
rlm@51 251 d_lineArt = raphe.path("M 350 165 L 512 165 M 350 173 L 512 173 M 350 181 L 512 181 M 350 189 L 512 189 M 350 197 L 512 197 M 350 213 L 512 213 M 350 205 L 512 205 M 350 221 L 512 221");
rlm@51 252 d_lineArt.attr('stroke', "#" + color);
rlm@51 253 return;
rlm@51 254 }
rlm@51 255
rlm@51 256 }
rlm@51 257
rlm@51 258
rlm@51 259
rlm@42 260 function redraw(style)
rlm@42 261 {
rlm@42 262
rlm@43 263
rlm@43 264
rlm@43 265
rlm@42 266 if (style == "bold")
rlm@42 267 {
rlm@42 268
rlm@44 269 clearAll();
rlm@44 270 smallRedraw("bold","Name");
rlm@44 271 smallRedraw("bold","Email");
rlm@42 272
rlm@42 273
rlm@42 274
rlm@42 275 }
rlm@42 276
rlm@42 277
rlm@42 278 if (style == "arrow")
rlm@42 279 {
rlm@42 280
rlm@44 281 clearAll();
rlm@42 282
rlm@44 283 smallRedraw("arrow","Name");
rlm@44 284 smallRedraw("arrow","Email");
rlm@44 285 smallRedraw("arrow","Occupation");
rlm@44 286 smallRedraw("arrow","Company");
rlm@42 287
rlm@43 288
rlm@42 289 }
rlm@42 290
rlm@42 291
rlm@42 292 if (style == "classic")
rlm@42 293 {
rlm@42 294
rlm@44 295 clearAll();
rlm@42 296
rlm@44 297 smallRedraw("classic","Name");
rlm@44 298 smallRedraw("classic","Email");
rlm@44 299 smallRedraw("classic","Occupation");
rlm@44 300 smallRedraw("classic","Company");
rlm@44 301 smallRedraw("classic","Phone");
rlm@44 302 smallRedraw("classic","Website");
rlm@42 303 }
rlm@42 304
rlm@42 305
rlm@42 306 if (style == "direct")
rlm@42 307 {
rlm@42 308
rlm@44 309 clearAll();
rlm@42 310
rlm@44 311 smallRedraw("direct","Name");
rlm@44 312 smallRedraw("direct","Email");
rlm@44 313 smallRedraw("direct","Occupation");
rlm@44 314 smallRedraw("direct","Company");
rlm@44 315 smallRedraw("direct","Phone");
rlm@44 316 smallRedraw("direct","Website");
rlm@42 317
rlm@42 318
rlm@42 319 }
rlm@42 320
rlm@51 321 lineDraw(style, "fefefe");
rlm@42 322
rlm@42 323
rlm@42 324
rlm@42 325 }
rlm@42 326
rlm@42 327