Mercurial > laserkard

comparison onlypaths/js/me.js @ 46:26c2b3ad21c7 laserkard

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[svn r47] saving progresswww.cinemassacre.com/new/?page_id=30
author rlm
date Sun, 31 Jan 2010 12:33:33 -0500
parents
children
comparison
equal deleted inserted replaced
45:bff96abdddfa 46:26c2b3ad21c7
1 /*
2 * Ext JS Library 2.1
3 * Copyright(c) 2006-2008, Ext JS, LLC.
4 * licensing@extjs.com
5 *
6 * http://extjs.com/license
7 */
8 Ext.BLANK_IMAGE_URL = 'theme/images/default/s.gif';
9 var mefillColor = {r:255,g:0,b:0,hex:'#ff0000',visible:'visible',color:'#ff0000',opacity:'1',gradient:'no'};
10 var mestrokeColor = {r:0,g:0,b:255,hex:'#000000',visible:'visible',color:'#ff0000',width:'1',opacity:'1',gradient:'no'};
11
12 var fillhex="#ff0000";
13 var squarecont=0;
14 var squarerows=6;
15 var squarecols=6;
16 var squarelist=new Array(squarerows);
17 var filldraw=true;
18 var strokedraw=true;
19 var mode_render_fill=2;
20 var mode_render_stroke=2;
21
22 var prevselect_fill='no-fill-gradient';
23 var prevselect_stroke='no-stroke-gradient';
24
25 for (i = 0; i < squarerows; i++)
26 {
27 squarelist[i]=new Array(squarecols);
28 }
29
30 function rgb2hex(r,g,b){
31 var rh= toHex(r);
32 var gh= toHex(g);
33 var bh= toHex(b);
34 return '#'+rh + '' + gh + '' + bh;
35 // document.getElementById('inputfillhex').value=fillhex;
36 //parent.c.editCommand('mefillcolor', color);
37 }
38
39 function hex2rgb(hex)
40 {
41 var regexp = new RegExp('^#?([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})$');
42 var match = hex.toLowerCase().match(regexp);
43
44 if (match)
45 {
46 var rgb = new Array(parseInt(match[1], 16), parseInt(match[2], 16), parseInt(match[3], 16));
47 return(rgb);
48 }
49 else
50 {
51 var rgb = new Array(0,0,0);
52 return(rgb);
53 }
54 }
55
56 function toHex(color){
57 color=parseInt(color).toString(16);
58 return color.length<2?"0"+color:color;
59 }
60
61 function squareDump(r,g,b,container) {
62 squareArray(r,g,b);
63 for (i = 0; i < squarerows; i++)
64 {
65 for (j = 0; j < squarecols; j++)
66 {
67 document.getElementById(container+i+'_'+j).style.backgroundColor = squarelist[i][j];
68 }
69 squarecont++;
70 }
71 squarecont=0;
72 }
73
74
75
76 function squareArray(r,g,b) {
77
78 var l00_05=ccnp(r,g,b,0,0,0,(squarerows+0));
79 var color00_05=l00_05.split("_");
80
81 var l05_55=ccnp(255,255,255,255-r,255-g,255-b,(squarerows+0));
82 var color05_55=l05_55.split("_");
83
84 var cols0, cols5, rowy;
85 var cad='';
86 for(var i=0;i<squarerows;i++){
87 cols0=color00_05[i].split(",");
88 cols5=color05_55[i].split(",");
89 //for(var j=0;j<squarecols;j++){
90 rowy=ccnprmtrc(parseInt(cols0[0]),parseInt(cols0[1]),parseInt(cols0[2]),parseInt(cols5[0]),parseInt(cols5[1]),parseInt(cols5[2]),squarecols+0);
91 squarelist[i]=rowy.split("_");
92 cad+=squarelist[i].join(" ");
93 //}
94 }
95
96 //alert(l00_60);
97 //document.getElementById('texta').value=cad;
98 }
99 function ccnp(a,b,c,d,e,f,nPartes){
100 var q=0
101 var crdnds='';
102 var h = 1 / (nPartes);
103 var k = (1 - q)* a + q * d;
104 var l = (1 - q)* b + q * e;
105 var m = (1 - q)* c + q * f;
106 // crdnds += k +" "+ l +" "+ m +", "+ R;
107 for (var i=0; i<=(nPartes) ;i++)
108 {
109 k = (1 - q)* a + q * d;
110 l = (1 - q)* b + q * e;
111 m = (1 - q)* c + q * f;
112 q = q + h;
113 if(i==(nPartes)){
114 crdnds+=''+ parseInt(Math.round(k)) +","+ parseInt(Math.round(l)) +","+ parseInt(Math.round(m)) +"" ;
115 }else{
116 crdnds+=''+ parseInt(Math.round(k)) +","+ parseInt(Math.round(l)) +","+ parseInt(Math.round(m)) +"_";
117
118 }
119 }
120 return crdnds;
121 }
122 function ccnprmtrc(a,b,c,d,e,f,nPartes){
123 var q=0
124 var crdnds='';
125 var h = 1 / (nPartes);
126 var k = (1 - q)* a + q * d;
127 var l = (1 - q)* b + q * e;
128 var m = (1 - q)* c + q * f;
129 // crdnds += k +" "+ l +" "+ m +", "+ R;
130 for (var i=0; i<=(nPartes) ;i++)
131 {
132 k = (1 - q)* a + q * d;
133 l = (1 - q)* b + q * e;
134 m = (1 - q)* c + q * f;
135 q = q + h;
136 if(i==(nPartes)){
137 crdnds+='rgb('+ parseInt(Math.round(k)) +","+ parseInt(Math.round(l)) +","+ parseInt(Math.round(m)) +")" ;
138 }else{
139 crdnds+='rgb('+ parseInt(Math.round(k)) +","+ parseInt(Math.round(l)) +","+ parseInt(Math.round(m)) +")_";
140
141 }
142 }
143 return crdnds;
144 }
145
146
147 /**
148 * Converts an HSL color value to RGB. Conversion formula adapted from
149 * http://en.wikipedia.org/wiki/HSL_color_space. Assumes h, s, and l are
150 * contained in the set [0, 1] and returns r, g, and b in the set [0, 255].
151 *
152 * @param {Number} h The hue
153 * @param {Number} s The saturation
154 * @param {Number} l The lightness
155 * @return {Array} The RGB representation
156 */
157 var hslToRgb = function(h, s, l){
158 var r, g, b;
159
160 if(s == 0){
161 r = g = b = l; // achromatic
162 }else{
163 function hue2rgb(p, q, t){
164 if(t < 0) t += 1;
165 if(t > 1) t -= 1;
166 if(t < 1/6) return p + (q - p) * 6 * t;
167 if(t < 1/2) return q;
168 if(t < 2/3) return p + (q - p) * (2/3 - t) * 6;
169 return p;
170 };
171
172 var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
173 var p = 2 * l - q;
174 r = hue2rgb(p, q, h + 1/3);
175 g = hue2rgb(p, q, h);
176 b = hue2rgb(p, q, h - 1/3);
177 }
178
179 return [parseInt(r * 255), parseInt(g * 255), parseInt(b * 255)];
180 };
181 /**
182 * Converts an RGB color value to HSL. Conversion formula adapted from
183 * http://en.wikipedia.org/wiki/HSL_color_space. Assumes r, g, and b are
184 * contained in the set [0, 255] and returns h, s, and l in the set [0, 1].
185 *
186 * @param {Number} r The red color value
187 * @param {Number} g The green color value
188 * @param {Number} b The blue color value
189 * @return {Array} The HSL representation
190 */
191 var rgbToHsl = function(r, g, b){
192 r /= 255, g /= 255, b /= 255;
193 var max = Math.max(r, g, b), min = Math.min(r, g, b);
194 var h, s, l = (max + min) / 2;
195
196 if(max == min){
197 h = s = 0; // achromatic
198 }else{
199 var d = max - min;
200 s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
201 switch(max){
202 case r: h = (g - b) / d + (g < b ? 6 : 0); break;
203 case g: h = (b - r) / d + 2; break;
204 case b: h = (r - g) / d + 4; break;
205 }
206 h /= 6;
207 }
208
209 return [h, s, l];
210 };
211 function selectSquare(x,y,container){
212 movecolors=0;
213 //$("#square"+x+"_"+y).css("border", "1px solid #000");
214 // $("#square"+x+"_"+y).mouseover(function(){
215
216 // }).mouseout(function(){
217 // $("#square"+x+"_"+y).css("border", "0px solid #000");
218 // });
219 var cadcolor=document.getElementById('square_'+container+(x)+'_'+y).style.backgroundColor
220 //document.getElementById('texta').value=cadcolor;
221 var treecolors=GetString(cadcolor, '(', ')');
222
223 //OPCTION?
224 var rgb=treecolors.split(', ');
225 //squareDump(rgb[0],rgb[1],rgb[2],'square_'+container);
226 if(container=='stroke')
227 {
228 Ext.get('width-slider-stroke-mask').applyStyles({'background-color':'rgb('+rgb[0]+','+rgb[1]+','+rgb[2]+')'});
229 //--document.forms.formstrokedata.mestrokecolor.value=rgb[0]+','+rgb[1]+','+rgb[2];
230 mestrokeColor.r=rgb[0];
231 mestrokeColor.g=rgb[1];
232 mestrokeColor.b=rgb[2];
233 mestrokeColor.hex=rgb2hex(rgb[0],rgb[1],rgb[2]);
234 c.editCommand('linecolor',mestrokeColor.hex);
235 }
236 else
237 {
238 //--document.forms.formfilldata.mefillcolor.value=rgb[0]+','+rgb[1]+','+rgb[2];
239 mefillColor.r=rgb[0]; mefillColor.g=rgb[1];mefillColor.b=rgb[2];
240 mefillColor.hex=rgb2hex(rgb[0],rgb[1],rgb[2]);
241 c.editCommand('fillcolor',mefillColor.hex);
242
243 }
244 Ext.get('opacity-slider-'+container).applyStyles({'background-color':'rgb('+rgb[0]+','+rgb[1]+','+rgb[2]+')'});
245 Ext.get(container+'-square').applyStyles({'background-color':'rgb('+rgb[0]+','+rgb[1]+','+rgb[2]+')'});
246
247 //document.getElementById('texta').value=rgb[0]+' '+rgb[1]+' '+rgb[2];
248 /* if(actualEdit ==1){
249 fillMemory();
250 }else{
251 strokeMemory();
252 }
253 $('.slider1').SliderSetValues([[Math.round(rgb[0]*45/255),0]]);
254 $('.slider2').SliderSetValues([[Math.round(rgb[1]*45/255),0]]);
255 $('.slider3').SliderSetValues([[Math.round(rgb[2]*45/255),0]]); //-(mefillColor.b*45/255)
256 */
257
258
259 }
260 function setbe(num,id)
261 {
262 if(num == 1)
263 {
264 if(filldraw==true)
265 {
266
267 Ext.get(id).dom.src ='img/theme/images/no.gif';
268 filldraw=false;
269 //--document.forms.formfilldata.fillvisible.value='hidden';
270 mefillColor.visible='hidden';
271 c.editCommand('fillcolor','none');
272 // $('#tape').show("slow");
273
274 }
275 else
276 {
277 Ext.get(id).dom.src ='img/theme/images/ok.gif';
278 filldraw=true;
279 //--document.forms.formfilldata.fillvisible.value='visible';
280 mefillColor.visible='visible';
281 c.editCommand('fillcolor',mefillColor.hex);
282 // $('#tape').hide("slow");
283 }
284 }
285
286 if( num== 2) // stroke
287 {
288 if(strokedraw==true)
289 {
290 Ext.get(id).dom.src ='img/theme/images/no.gif';
291 strokedraw=false;
292 //--document.forms.formstrokedata.strokevisible.value='hidden';
293 mestrokeColor.visible='hidden';
294 c.editCommand('linecolor','none');
295 //$('#tape').show("slow");
296 }
297 else
298 {
299 Ext.get(id).dom.src ='img/theme/images/ok.gif';
300 strokedraw=true;
301 //--document.forms.formstrokedata.strokevisible.value='visible';
302 mestrokeColor.visible='visible';
303 c.editCommand('linecolor',mestrokeColor.hex);
304 //$('#tape').hide("slow");
305 }
306 }
307 }
308
309 ///////////
310
311 function onColorChange(){
312 c.lineColor =mestrokeColor.hex;
313 c.fillColor = mefillColor.hex;
314 c.lineWidth =mestrokeColor.width;
315 c.lineOpac = mestrokeColor.opacity;
316 c.fillOpac = mefillColor.opacity;
317 if(mefillColor.visible=='hidden')
318 {
319 c.fillColor = 'none';
320 }
321 if(mestrokeColor.visible=='hidden')
322 {
323 c.lineColor = 'none';
324 }
325 return;
326 }
327
328 ///////////
329
330 function setProperties(){
331
332 Ext.get('opacity-slider-fill').applyStyles({'background-color':'rgb('+mefillColor.r+','+mefillColor.g+','+mefillColor.b+')'});
333 Ext.get('fill-square').applyStyles({'background-color':'rgb('+mefillColor.r+','+mefillColor.g+','+mefillColor.b+')'});
334 squareDump(mefillColor.r,mefillColor.g,mefillColor.b,'square_fill');
335
336 Ext.get('opacity-slider-stroke').applyStyles({'background-color':'rgb('+mestrokeColor.r+','+mestrokeColor.g+','+mestrokeColor.b+')'});
337 Ext.get('width-slider-stroke-mask').applyStyles({'background-color':'rgb('+mestrokeColor.r+','+mestrokeColor.g+','+mestrokeColor.b+')'});
338 Ext.get('stroke-square').applyStyles({'background-color':'rgb('+mestrokeColor.r+','+mestrokeColor.g+','+mestrokeColor.b+')'});
339 squareDump(mestrokeColor.r,mestrokeColor.g,mestrokeColor.b,'square_stroke');
340
341 }
342 //////////
343
344
345 function GetString(source, start, end){
346 var st = source.indexOf(start) + start.length;
347 var en = source.indexOf(end, start);
348 return source.substring(st, en);//trimAll(source.substring(st, en));
349 }
350
351
352
353
354 var basicColors=new Array(" ",
355 "ff0000","ff8800","ffcc00",
356 "ffff00","ccff00","88ff00","00ff00","00ff88","00ffcc","00ffff",
357 "00ccff","0088ff","0000ff","8800ff","cc00ff","ff00ff","ff00cc","ff0088"
358 );
359
360 var str=''
361 for(var a=1;a<basicColors.length;a++){
362 str+='<span id="s'+a+'" style="background-color:'+basicColors[a]+'; width:2px;font-size:0.95em">.</span>';
363 }
364 var str1=''
365 for(var a=basicColors.length;a>0;a--){
366 str1+='<span id="s'+a+'" style="background-color:'+basicColors[a]+'; width:2px;font-size:8px">&nbsp;</span>';
367 }
368
369
370 var str2='';
371 var contx=0;
372 var conty=0;
373 var unitx=8;
374 var unity=8;
375 var widthsq='width: '+unitx+'px;';
376 for (i = 0; i < squarerows; i++)
377 {
378 contx=0;
379 for (j = 0; j < squarecols; j++)
380 {
381 str2+='<div class="colorFillSquare" id="square_fill'+i+'_'+j+'" style="'+widthsq+' left:'+contx+'px; top:'+conty+'px;" onmouseover="this.style.borderWidth=\'1px\'; this.style.zIndex=100" onmouseout="this.style.borderWidth=\'0px\';this.style.zIndex=0" onclick="selectSquare('+i+','+j+',\'fill\')"></div>';
382 contx+=unitx;
383 }
384 conty+=unity;
385 }
386
387
388 var str3='';
389 var contx=0;
390 var conty=0;
391 var unitx=8;
392 var unity=8;
393 var widthsq='width: '+unitx+'px;';
394 for (i = 0; i < squarerows; i++)
395 {
396 contx=0;
397 for (j = 0; j < squarecols; j++)
398 {
399 str3+='<div class="colorStrokeSquare" id="square_stroke'+i+'_'+j+'" style="'+widthsq+' left:'+contx+'px; top:'+conty+'px;" onmouseover="this.style.borderWidth=\'1px\'; this.style.zIndex=100" onmouseout="this.style.borderWidth=\'0px\';this.style.zIndex=0" onclick="selectSquare('+i+','+j+',\'stroke\')"></div>';
400 contx+=unitx;
401 }
402 conty+=unity;
403 }
404
405 /////////////////////
406
407 var str4='';
408 str4+='<span id="linear-fill-gradient" class="toolboxItem" title="Linear gradient" onmouseout="select(this,0,0)" onmouseover="select(this,1,0)" onclick="select(this,2,0)"><img src="theme/images/gradient_linear.gif"></span>&nbsp;&nbsp;';
409 str4+='<span id="radial-fill-gradient" class="toolboxItem" title="Radial gradient" onmouseout="select(this,0,1)" onmouseover="select(this,1,1)" onclick="select(this,2,1)"><img src="theme/images/gradient_radial.gif"></span>&nbsp;&nbsp;';
410 str4+='<span id="no-fill-gradient" class="toolboxItem" title="No gradient" onmouseout="select(this,0,2)" onmouseover="select(this,1,2)" onclick="select(this,2,2)"><img src="theme/images/gradient_no.gif"></span>';
411
412 /////////////////////
413
414 var str5='';
415 str5+='<span id="linear-stroke-gradient" class="toolboxItem" title="Linear gradient" onmouseout="select(this,0,0)" onmouseover="select(this,1,0)" onclick="select(this,2,0)"><img src="theme/images/gradient_linear.gif"></span>&nbsp;&nbsp;';
416 str5+='<span id="radial-stroke-gradient" class="toolboxItem" title="Radial gradient" onmouseout="select(this,0,1)" onmouseover="select(this,1,1)" onclick="select(this,2,1)"><img src="theme/images/gradient_radial.gif"></span>&nbsp;&nbsp;';
417 str5+='<span id="no-stroke-gradient" class="toolboxItem" title="No gradient" onmouseout="select(this,0,2)" onmouseover="select(this,1,2)" onclick="select(this,2,2)"><img src="theme/images/gradient_no.gif"></span>';
418
419 /////////////////////
420
421 var str6=''; //<form name="formfilldata">
422 str6+='<input type="text" class="field" name="fillvisible" title="Fill visible" value="visible" size="2">';
423 str6+='<input type="text" class="field" name="fillcolor" title="Fill color"value="255,0,0" size="2">';
424 str6+='<input type="text" class="field" name="fillopacity" title="Fill opacity" value="100" size="2">';
425 str6+='<input type="text" class="field" name="fillgradient" title="Fill gradient" value="no" size="2">';
426 str6+='';
427
428 var str7=''; // <form name="formstrokedata">
429 str7+='<input type="text" class="field" title="Stroke visible" name="strokevisible" value="visible" size="2">';
430 str7+='<input type="text" class="field" title="Stroke color" name="strokecolor" value="0,0,0" size="2">';
431 str7+='<input type="text" class="field" title="Stroke width" name="strokewidth" value="1" size="2">';
432 str7+='<input type="text" class="field" title="Stroke opacity" name="strokeopacity" value="100" size="2">';
433 str7+='<input type="text" class="field" title="Stroke gradienr" name="strokegradient" value="no" size="2">';
434
435 str7+='';
436
437
438 //ONREADY
439
440 Ext.onReady(function() {
441
442
443 // Ext.get("mefillColor").dom.innerHTML=(str);
444 // Ext.get("mestrokeColor").dom.innerHTML=(str1);
445
446
447
448
449 Ext.get("fillContainer").dom.innerHTML=(str2);
450 Ext.get("strokeContainer").dom.innerHTML=(str3);
451 //Ext.get("toolbox_fill").dom.innerHTML=(str4);
452 //Ext.get("toolbox_stroke").dom.innerHTML=(str5);
453 // Ext.get("divformfill").dom.innerHTML=(str6);
454 //Ext.get("divformstroke").dom.innerHTML=(str7);
455
456
457 Ext.get('fill-square').applyStyles({'background-color':'rgb(255,0,0)'});
458 Ext.get('stroke-square').applyStyles({'background-color':'rgb(0,0,0)'});
459 //Ext.get('no-stroke-gradient').applyStyles({'background-position':'0 0'});
460 //Ext.get('no-fill-gradient').applyStyles({'background-position':'0 0'});
461
462 var color=hslToRgb(0, 1, 0.5);
463 squareDump(color[0],color[1],color[2],'square_fill');
464
465 var color=hslToRgb(0, 0, 0);
466 squareDump(color[0],color[1],color[2],'square_stroke');
467
468 //console.log('The windows has been loaded','fill-square' );
469 new Ext.Slider({
470 renderTo: 'slider-fill',
471 width: 62,
472 height: 5,
473 minValue: -1,
474 maxValue: 360,
475 value: 10,
476 plugins: new Ext.ux.SliderFillColor()
477 });
478 new Ext.Slider({
479 renderTo: 'opacity-slider-fill',
480 width: 55,
481 minValue: 0,
482 maxValue: 100,
483 value: 100,
484 plugins: new Ext.ux.SliderOpacityFill()
485 });
486
487 new Ext.Slider({
488 renderTo: 'slider-stroke',
489 width: 62,
490 minValue: -1,
491 maxValue: 360,
492 value: -1,
493 plugins: new Ext.ux.SliderStrokeColor()
494 });
495
496 new Ext.Slider({
497 renderTo: 'opacity-slider-stroke',
498 width: 57,
499 minValue: 0,
500 maxValue: 100,
501 value: 100,
502 plugins: new Ext.ux.SliderOpacityStroke()
503 });
504 new Ext.Slider({
505 renderTo: 'width-slider-stroke',
506 width: 57,
507 minValue: 0,
508 maxValue: 50,
509 value: 1,
510 plugins: new Ext.ux.SliderWidth()
511 });
512
513
514 });
515
516 // end ONREADY
517
518
519
520
521
522 Ext.ux.SliderFillColor = Ext.extend(Ext.Tip, {
523 minWidth: 10,
524 offsets : [0, -10],
525 init : function(slider){
526 slider.on('dragstart', this.onSlide, this);
527 slider.on('drag', this.onSlide, this);
528 slider.on('dragend', this.hide, this);
529 slider.on('destroy', this.destroy, this);
530 },
531
532 onSlide : function(slider){
533 //this.show();
534 //this.doAutoWidth();
535 //this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
536 if(this.getText(slider)<0 || this.getText(slider)>359)
537 {
538 var color=new Array();
539 color[0]='0';
540 color[1]='0';
541 color[2]='0';
542
543 if(this.getText(slider)>359)
544 {
545
546 color[0]='245';
547 color[1]='245';
548 color[2]='245';
549 }
550 Ext.get('fill-square').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
551 Ext.get('opacity-slider-fill').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
552
553 }
554 else
555 {
556 var color=hslToRgb((this.getText(slider)/359), 1, 0.5);
557 Ext.get('fill-square').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
558 Ext.get('opacity-slider-fill').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
559 //var color=hslToRgb((this.getText(slider)/359), 1, 0.5);
560 }
561
562 squareDump(color[0],color[1],color[2],'square_fill');
563 //Ext.get("fillcolor").dom.innerHTML=(color[0]+','+color[1]+','+color[2]);
564 //--document.forms.formfilldata.fillcolor.value=color[0]+','+color[1]+','+color[2];
565 mefillColor.r=color[0]; mefillColor.g=color[1]; mefillColor.b=color[2];
566 mefillColor.hex=rgb2hex(color[0],color[1],color[2]);
567 c.editCommand('fillcolor',mefillColor.hex);
568
569 //Ext.get("squareFill0_0").applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
570 // Ext.get("squareFill0_5").applyStyles({'background-color':'rgb(255,255,255)'});
571 //Ext.get("squareFill5_5").applyStyles({'background-color':'rgb('+Math.abs(color[0]-255)+','+Math.abs(color[1]-255)+','+Math.abs(color[2]-255)+')'});
572 // Ext.get("squareFill5_0").applyStyles({'background-color':'rgb(0,0,0)'});
573 //Ext.get("text").dom.innerHTML=color[0];
574
575 },
576
577 getText : function(slider){
578 return slider.getValue();
579 }
580 });
581
582
583
584
585 Ext.ux.SliderStrokeColor = Ext.extend(Ext.Tip, {
586 minWidth: 10,
587 offsets : [0, -10],
588 init : function(slider){
589 slider.on('dragstart', this.onSlide, this);
590 slider.on('drag', this.onSlide, this);
591 slider.on('dragend', this.hide, this);
592 slider.on('destroy', this.destroy, this);
593 },
594
595 onSlide : function(slider){
596 //this.show();
597 //this.doAutoWidth();
598 //this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
599 if(this.getText(slider)<0 || this.getText(slider)>359)
600 {
601 var color=new Array();
602 color[0]='0';
603 color[1]='0';
604 color[2]='0';
605
606 if(this.getText(slider)>359)
607 {
608
609 color[0]='245';
610 color[1]='245';
611 color[2]='245';
612 }
613 Ext.get('stroke-square').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
614 Ext.get('opacity-slider-stroke').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
615 Ext.get('width-slider-stroke-mask').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
616
617 }
618 else
619 {
620 var color=hslToRgb((this.getText(slider)/359), 1, 0.5);
621 Ext.get('stroke-square').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
622 Ext.get('opacity-slider-stroke').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
623 Ext.get('width-slider-stroke-mask').applyStyles({'background-color':'rgb('+color[0]+','+color[1]+','+color[2]+')'});
624
625 /*Ext.get('stroke-square').applyStyles({'background-color':'hsl('+this.getText(slider)+',100%,50%)'});
626 Ext.get('opacity-slider-stroke').applyStyles({'background-color':'hsl('+this.getText(slider)+',100%,50%)'});
627 var color=hslToRgb((this.getText(slider)/359), 1, 0.5);
628 Ext.get('width-slider-stroke-mask').applyStyles({'background-color':'hsl('+this.getText(slider)+',100%,50%)'});
629 */
630 }
631
632
633
634 //Ext.get('stroke-square').applyStyles({'background-color':'hsl('+this.getText(slider)+',100%,50%)'});
635 //Ext.get('opacity-slider-stroke').applyStyles({'background-color':'hsl('+this.getText(slider)+',100%,50%)'});
636
637 //var color=hslToRgb((this.getText(slider)/359), 1, 0.5);
638 squareDump(color[0],color[1],color[2],'square_stroke');
639 //--document.forms.formstrokedata.strokecolor.value=color[0]+','+color[1]+','+color[2];
640 mestrokeColor.r=color[0]; mestrokeColor.g=color[1]; mestrokeColor.b=color[2];
641 mestrokeColor.hex=rgb2hex(color[0],color[1],color[2]);
642 c.editCommand('linecolor',mestrokeColor.hex);
643 // this.body.update(''+this.getText(slider));
644
645 },
646
647 getText : function(slider){
648 return slider.getValue();
649 }
650 });
651
652
653
654 Ext.ux.SliderOpacityFill = Ext.extend(Ext.Tip, {
655 minWidth: 10,
656 offsets : [0, -10],
657 init : function(slider){
658 slider.on('dragstart', this.onSlide, this);
659 slider.on('drag', this.onSlide, this);
660 slider.on('dragend', this.hide, this);
661 slider.on('destroy', this.destroy, this);
662 },
663
664 onSlide : function(slider){
665 this.show();
666 this.body.update(''+this.getText(slider)+'%');
667 this.doAutoWidth();
668 this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
669 changeOpacity(this.getText(slider)/100, 'opacity-slider-fill');
670 //--document.forms.formfilldata.fillopacity.value=this.getText(slider);
671 mefillColor.opacity=this.getText(slider)/100;
672 c.editCommand('fillopacity',mefillColor.opacity);
673 },
674
675 getText : function(slider){
676 return slider.getValue();
677 }
678 });
679 Ext.ux.SliderOpacityStroke = Ext.extend(Ext.Tip, {
680 minWidth: 10,
681 offsets : [0, -10],
682 init : function(slider){
683 slider.on('dragstart', this.onSlide, this);
684 slider.on('drag', this.onSlide, this);
685 slider.on('dragend', this.hide, this);
686 slider.on('destroy', this.destroy, this);
687 },
688
689 onSlide : function(slider){
690 this.show();
691 this.body.update(''+this.getText(slider)+'%');
692 this.doAutoWidth();
693 this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
694 changeOpacity(this.getText(slider)/100, 'opacity-slider-stroke');
695 //--document.forms.formstrokedata.strokeopacity.value=this.getText(slider);
696 mestrokeColor.opacity=this.getText(slider)/100;
697 c.editCommand('lineopacity',mestrokeColor.opacity);
698 },
699
700 getText : function(slider){
701 return slider.getValue();
702 }
703 });
704
705 Ext.ux.SliderWidth = Ext.extend(Ext.Tip, {
706 minWidth: 10,
707 offsets : [0, -10],
708 init : function(slider){
709 slider.on('dragstart', this.onSlide, this);
710 slider.on('drag', this.onSlide, this);
711 slider.on('dragend', this.hide, this);
712 slider.on('destroy', this.destroy, this);
713 },
714
715 onSlide : function(slider){
716 this.show();
717 this.body.update(''+this.getText(slider)+'px');
718 this.doAutoWidth();
719 this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
720 Ext.get('width-slider-stroke-mask').applyStyles({'width':this.getText(slider)+'px'});
721 //--document.forms.formstrokedata.strokewidth.value=this.getText(slider);
722 mestrokeColor.width=this.getText(slider);
723 c.editCommand('linewidth',mestrokeColor.width);
724 },
725
726 getText : function(slider){
727 return slider.getValue();
728 }
729 });
730
731
732
733
734
735 //===================================
736 //===================================
737
738 function select(select,action,type){
739 var id=select.id;
740 if(type==0){var text='lineal';}
741 if(type==1){var text='radial';}
742 if(type==2){var text='no';}
743 // && mode_render_fill!=type
744 if(action==0 && mode_render_fill!=type)
745 {
746 Ext.get(id).applyStyles({'background-position':'0 12px'});
747
748
749 }
750 if(action==1 && mode_render_fill!=type)
751 {
752 Ext.get(id).applyStyles({'background-position':'0 0'});
753
754 }
755 if(action==2)
756 {
757 mode_render_fill=type;
758 if(id.indexOf('fill')!=-1)
759 {
760 Ext.get(prevselect_fill).applyStyles({'background-position':'0 12px'});
761 prevselect_fill=id;
762 //--document.forms.formfilldata.fillgradient.value=text;
763 }else{
764
765 Ext.get(prevselect_stroke).applyStyles({'background-position':'0 12px'});
766 prevselect_stroke=id;
767 //--document.forms.formstrokedata.strokegradient.value=text;
768 }
769 Ext.get(id).applyStyles({'background-position':'0 0'});
770
771
772 }
773 }
774
775 function changeOpacity(opacity, id)
776 {
777 var object = document.getElementById(id).style;
778 object.opacity = (opacity );
779 object.MozOpacity = (opacity);
780 object.KhtmlOpacity = (opacity);
781 object.filter = "alpha(opacity=" + parseFloat(opacity*100) + ")";
782 }
783
784 //print() function will just create a window similar to the default alert function within the page.
785 //Arguments
786 // txt - The message that appears in the box.
787 // title - The title of the box(OPTIONAL)
788
789 /*
790 if(typeof console != 'object') {
791 console = {};
792 console.log = function(){return false;};
793 }
794
795
796 /////////////////
797 var Docs = function(){
798 return {
799 init : function(){
800 var loading = Ext.get('loading');
801 var mask = Ext.get('loading-mask');
802 mask.setOpacity(.1);
803 mask.shift({
804 xy:loading.getXY(),
805 width:loading.getWidth(),
806 height:loading.getHeight(),
807 remove:true,
808 duration:1,
809 opacity:.8,
810 easing:'bounceOut',
811 callback : function(){
812 loading.fadeOut({duration:.1,remove:true});
813 }
814 });
815 }
816 };
817 }();
818 Ext.onReady(Docs.init, Docs, true);
819 */