| [ Index ] |
|
Code source de eGroupWare 1.2.106-2 |
1 /*********************************************************************** 2 ** Title.........: Online Image Editor Interface 3 ** Version.......: 1.0 4 ** Author........: Xiang Wei ZHUO <wei@zhuo.org> 5 ** Filename......: EditorContents.js 6 ** Last changed..: 31 Aug 2003 7 ** Notes.........: Handles most of the interface routines for the ImageEditor. 8 **/ 9 10 11 function MM_findObj(n, d) { //v4.01 12 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { 13 d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 14 if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; 15 for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); 16 if(!x && d.getElementById) x=d.getElementById(n); return x; 17 } 18 19 var pic_x, pic_y; 20 function P7_Snap() { //v2.62 by PVII 21 var x,y,ox,bx,oy,p,tx,a,b,k,d,da,e,el,args=P7_Snap.arguments;a=parseInt(a); 22 for (k=0; k<(args.length-3); k+=4) 23 if ((g=MM_findObj(args[k]))!=null) { 24 el=eval(MM_findObj(args[k+1])); 25 a=parseInt(args[k+2]);b=parseInt(args[k+3]); 26 x=0;y=0;ox=0;oy=0;p="";tx=1;da="document.all['"+args[k]+"']"; 27 if(document.getElementById) { 28 d="document.getElementsByName('"+args[k]+"')[0]"; 29 if(!eval(d)) {d="document.getElementById('"+args[k]+"')";if(!eval(d)) {d=da;}} 30 }else if(document.all) {d=da;} 31 if (document.all || document.getElementById) { 32 while (tx==1) {p+=".offsetParent"; 33 if(eval(d+p)) {x+=parseInt(eval(d+p+".offsetLeft"));y+=parseInt(eval(d+p+".offsetTop")); 34 }else{tx=0;}} 35 ox=parseInt(g.offsetLeft);oy=parseInt(g.offsetTop);var tw=x+ox+y+oy; 36 if(tw==0 || (navigator.appVersion.indexOf("MSIE 4")>-1 && navigator.appVersion.indexOf("Mac")>-1)) { 37 ox=0;oy=0;if(g.style.left){x=parseInt(g.style.left);y=parseInt(g.style.top); 38 }else{var w1=parseInt(el.style.width);bx=(a<0)?-5-w1:-10; 39 a=(Math.abs(a)<1000)?0:a;b=(Math.abs(b)<1000)?0:b; 40 //alert(event.clientX); 41 if (event == null) x=document.body.scrollLeft + bx; 42 else x=document.body.scrollLeft + event.clientX + bx; 43 if (event == null) y=document.body.scrollTop; 44 else y=document.body.scrollTop + event.clientY;}} 45 }else if (document.layers) {x=g.x;y=g.y;var q0=document.layers,dd=""; 46 for(var s=0;s<q0.length;s++) {dd='document.'+q0[s].name; 47 if(eval(dd+'.document.'+args[k])) {x+=eval(dd+'.left');y+=eval(dd+'.top');break;}}} 48 if(el) {e=(document.layers)?el:el.style; 49 var xx=parseInt(x+ox+a),yy=parseInt(y+oy+b); 50 //alert(xx+":"+yy); 51 if(navigator.appName=="Netscape" && parseInt(navigator.appVersion)>4){xx+="px";yy+="px";} 52 if(navigator.appVersion.indexOf("MSIE 5")>-1 && navigator.appVersion.indexOf("Mac")>-1){ 53 xx+=parseInt(document.body.leftMargin);yy+=parseInt(document.body.topMargin); 54 xx+="px";yy+="px";}e.left=xx;e.top=yy;} 55 pic_x = parseInt(xx); pic_y = parseInt(yy); 56 //alert(xx+":"+yy); 57 } 58 } 59 60 var ie=document.all 61 var ns6=document.getElementById&&!document.all 62 63 var dragapproved=false 64 var z,x,y,status, ant, canvas, content, pic_width, pic_height, image, resizeHandle, oa_w, oa_h, oa_x, oa_y, mx2, my2; 65 66 67 function init_resize() 68 { 69 if(mode == "scale") 70 { 71 P7_Snap('theImage','ant',0,0); 72 73 if (canvas == null) 74 canvas = MM_findObj("imgCanvas"); 75 76 if (pic_width == null || pic_height == null) 77 { 78 image = MM_findObj("theImage"); 79 pic_width = image.width; 80 pic_height = image.height; 81 } 82 83 if (ant == null) 84 ant = MM_findObj("ant"); 85 86 ant.style.left = pic_x; ant.style.top = pic_y; 87 ant.style.width = pic_width; ant.style.height = pic_height; 88 ant.style.visibility = "visible"; 89 90 drawBoundHandle(); 91 jg_doc.paint(); 92 } 93 } 94 95 function init() 96 { 97 init_crop(); 98 init_resize(); 99 var markerImg = MM_findObj('markerImg', window.top.document); 100 101 if (markerImg.src.indexOf("t_white.gif")>0) 102 toggleMarker() ; 103 } 104 105 function init_crop() 106 { 107 //if(mode == "crop") { 108 P7_Snap('theImage','ant',0,0); 109 //} 110 } 111 112 function setMode(newMode) 113 { 114 mode = newMode; 115 reset(); 116 } 117 118 function reset() 119 { 120 if (ant == null) 121 ant = MM_findObj("ant"); 122 123 ant.style.visibility = "hidden"; 124 ant.style.left = 0; 125 ant.style.top = 0; 126 ant.style.width = 0; 127 ant.style.height = 0; 128 129 mx2 = null; 130 my2 = null; 131 132 jg_doc.clear(); 133 if(mode != 'measure') 134 showStatus(); 135 136 if(mode == "scale") { 137 init_resize(); 138 } 139 140 P7_Snap('theImage','ant',0,0); 141 } 142 143 function toggleMarker() 144 { 145 //alert("Toggle"); 146 if (ant == null) 147 ant = MM_findObj("ant"); 148 149 if(ant.className=="selection") 150 ant.className="selectionWhite"; 151 else 152 ant.className="selection"; 153 154 if (jg_doc.getColor() == "#000000") 155 jg_doc.setColor("#FFFFFF"); 156 else 157 jg_doc.setColor("#000000"); 158 159 drawBoundHandle 160 jg_doc.paint(); 161 } 162 163 164 function move(e) 165 { 166 if (dragapproved) 167 { 168 //z.style.left=ns6? temp1+e.clientX-x: temp1+event.clientX-x 169 //z.style.top=ns6? temp2+e.clientY-y : temp2+event.clientY-y 170 var w = ns6? temp1+e.clientX - x : temp1+event.clientX - x; 171 var h = ns6? temp2+e.clientY - y : temp2+event.clientY - y; 172 173 //alert(canvas.style.left); 174 /*if (status !=null) 175 { 176 status.innerHTML = "x:"+x+" y:"+y+" w:"+w+" h:"+h+" can_h:"+pic_height; 177 status.innerHTML += " can_w:"+pic_width+" px:"+pic_x+" py:"+pic_y; 178 status.innerHTML += " pix:"+image.style.left+" piy:"+image.style.top+" obj:"+obj.id; 179 }*/ 180 181 /*jg_doc.clear(); 182 jg_doc.fillRectPattern(0,0,Math.abs(w),Math.abs(h),pattern); 183 jg_doc.paint(); 184 */ 185 if (ant != null) 186 { 187 if (w >= 0) 188 { 189 ant.style.left = x; 190 ant.style.width = w; 191 } 192 else 193 { 194 ant.style.left = x+w; 195 ant.style.width = -1*w; 196 } 197 198 if (h >= 0) 199 { 200 ant.style.top = y; 201 ant.style.height = h; 202 } 203 else 204 { 205 ant.style.top = y+h; 206 ant.style.height = -1*h 207 } 208 } 209 210 showStatus(); 211 return false 212 } 213 } 214 215 function moveContent(e) 216 { 217 if (dragapproved) 218 { 219 220 var dx =ns6? oa_x + e.clientX-x: oa_x + event.clientX-x 221 var dy =ns6? oa_y + e.clientY-y : oa_y + event.clientY-y 222 223 224 /*if (status !=null) 225 { 226 status.innerHTML = "x:"+x+" y:"+y+" dx:"+dx+" dy:"+dy; 227 }*/ 228 229 ant.style.left = dx; 230 ant.style.top = dy; 231 232 showStatus(); 233 234 return false; 235 } 236 } 237 238 function moveHandle(e) 239 { 240 if (dragapproved) 241 { 242 var w = ns6? e.clientX - x : event.clientX - x; 243 var h = ns6? e.clientY - y : event.clientY - y; 244 245 switch(resizeHandle) 246 { 247 248 case "s-resize": 249 if (oa_h + h >= 0) 250 ant.style.height = oa_h + h; 251 break; 252 case "e-resize": 253 if(oa_w + w >= 0) 254 ant.style.width = oa_w + w; 255 break; 256 case "n-resize": 257 if (oa_h - h >= 0) 258 { 259 ant.style.top = oa_y + h; 260 ant.style.height = oa_h - h; 261 } 262 break; 263 case "w-resize": 264 if(oa_w - w >= 0) { 265 ant.style.left = oa_x + w; 266 ant.style.width = oa_w - w; 267 }break; 268 case "nw-resize": 269 if(oa_h - h >= 0 && oa_w - w >= 0) { 270 ant.style.left = oa_x + w; 271 ant.style.width = oa_w - w; 272 ant.style.top = oa_y + h; 273 ant.style.height = oa_h - h; 274 } 275 break; 276 case "ne-resize": 277 if (oa_h - h >= 0 && oa_w + w >= 0){ 278 ant.style.top = oa_y + h; 279 ant.style.height = oa_h - h; 280 ant.style.width = oa_w + w; 281 } 282 break; 283 case "se-resize": 284 if (oa_h + h >= 0 && oa_w + w >= 0) 285 { 286 ant.style.height = oa_h + h; 287 ant.style.width = oa_w + w; 288 } 289 break; 290 case "sw-resize": 291 if (oa_h + h >= 0 && oa_w - w >= 0) 292 { 293 ant.style.height = oa_h + h; 294 ant.style.left = oa_x + w; 295 ant.style.width = oa_w - w; 296 } 297 } 298 299 showStatus(); 300 return false; 301 302 } 303 } 304 305 function drags(e) 306 { 307 if (!ie&&!ns6) 308 return 309 310 var firedobj=ns6? e.target : event.srcElement 311 var topelement=ns6? "HTML" : "BODY" 312 313 while (firedobj.tagName!=topelement&& 314 !(firedobj.className=="crop" 315 || firedobj.className=="handleBox" 316 || firedobj.className=="selection" || firedobj.className=="selectionWhite")) 317 { 318 firedobj=ns6? firedobj.parentNode : firedobj.parentElement 319 } 320 321 if(firedobj.className=="handleBox") { 322 323 if(content != null) { 324 if(content.width != null && content.height != null) { 325 content.width = 0; 326 content.height = 0; 327 } 328 //alert(content.width+":"+content.height); 329 } 330 resizeHandle = firedobj.id; 331 332 /*if(status!=null) { 333 status.innerHTML = " obj:"+firedobj.id; 334 }*/ 335 336 x=ns6? e.clientX: event.clientX 337 y=ns6? e.clientY: event.clientY 338 339 oa_w = parseInt(ant.style.width); 340 oa_h = parseInt(ant.style.height); 341 oa_x = parseInt(ant.style.left); 342 oa_y = parseInt(ant.style.top); 343 344 dragapproved=true 345 document.onmousemove=moveHandle; 346 return false; 347 } 348 else 349 if((firedobj.className == "selection" || firedobj.className=="selectionWhite")&& mode == "crop") { 350 351 x=ns6? e.clientX: event.clientX 352 y=ns6? e.clientY: event.clientY 353 354 oa_x = parseInt(ant.style.left); 355 oa_y = parseInt(ant.style.top); 356 357 dragapproved=true 358 document.onmousemove=moveContent; 359 return false; 360 } 361 else 362 if (firedobj.className=="crop" && mode == "crop") 363 { 364 if(content != null) { 365 if(content.width != null && content.height != null) { 366 content.width = 0; 367 content.height = 0; 368 } 369 //alert(content.width+":"+content.height); 370 } 371 372 if (status == null) 373 status = MM_findObj("status"); 374 375 if (ant == null) 376 ant = MM_findObj("ant"); 377 378 if (canvas == null) 379 canvas = MM_findObj("imgCanvas"); 380 if(content == null) { 381 content = MM_findObj("cropContent"); 382 } 383 384 if (pic_width == null || pic_height == null) 385 { 386 image = MM_findObj("theImage"); 387 pic_width = image.width; 388 pic_height = image.height; 389 } 390 391 ant.style.visibility = "visible"; 392 393 obj = firedobj; 394 dragapproved=true 395 z=firedobj 396 temp1=parseInt(z.style.left+0) 397 temp2=parseInt(z.style.top+0) 398 x=ns6? e.clientX: event.clientX 399 y=ns6? e.clientY: event.clientY 400 document.onmousemove=move 401 return false 402 } 403 else if(firedobj.className=="crop" && mode == "measure") { 404 405 if (ant == null) 406 ant = MM_findObj("ant"); 407 408 if (canvas == null) 409 canvas = MM_findObj("imgCanvas"); 410 411 x=ns6? e.clientX: event.clientX 412 y=ns6? e.clientY: event.clientY 413 414 //jg_doc.draw 415 dragapproved=true 416 document.onmousemove=measure 417 418 return false 419 } 420 } 421 422 function measure(e) 423 { 424 if (dragapproved) 425 { 426 mx2 = ns6? e.clientX : event.clientX; 427 my2 = ns6? e.clientY : event.clientY; 428 429 jg_doc.clear(); 430 jg_doc.setStroke(Stroke.DOTTED); 431 jg_doc.drawLine(x,y,mx2,my2); 432 jg_doc.paint(); 433 showStatus(); 434 return false; 435 } 436 } 437 438 function setMarker(nx,ny,nw,nh) 439 { 440 if (ant == null) 441 ant = MM_findObj("ant"); 442 443 if (canvas == null) 444 canvas = MM_findObj("imgCanvas"); 445 if(content == null) { 446 content = MM_findObj("cropContent"); 447 } 448 449 if (pic_width == null || pic_height == null) 450 { 451 image = MM_findObj("theImage"); 452 pic_width = image.width; 453 pic_height = image.height; 454 } 455 456 ant.style.visibility = "visible"; 457 458 nx = pic_x + nx; 459 ny = pic_y + ny; 460 461 if (nw >= 0) 462 { 463 ant.style.left = nx; 464 ant.style.width = nw; 465 } 466 else 467 { 468 ant.style.left = nx+nw; 469 ant.style.width = -1*nw; 470 } 471 472 if (nh >= 0) 473 { 474 ant.style.top = ny; 475 ant.style.height = nh; 476 } 477 else 478 { 479 ant.style.top = ny+nh; 480 ant.style.height = -1*nh 481 } 482 483 484 } 485 486 function max(x,y) 487 { 488 if(y > x) 489 return x; 490 else 491 return y; 492 } 493 494 function drawBoundHandle() 495 { 496 if(ant == null || ant.style == null) 497 return false; 498 499 var ah = parseInt(ant.style.height); 500 var aw = parseInt(ant.style.width); 501 var ax = parseInt(ant.style.left); 502 var ay = parseInt(ant.style.top); 503 504 jg_doc.drawHandle(ax-15,ay-15,30,30,"nw-resize"); //upper left 505 jg_doc.drawHandle(ax-15,ay+ah-15,30,30,"sw-resize"); //lower left 506 jg_doc.drawHandle(ax+aw-15,ay-15,30,30,"ne-resize"); //upper right 507 jg_doc.drawHandle(ax+aw-15,ay+ah-15,30,30,"se-resize"); //lower right 508 509 jg_doc.drawHandle(ax+max(15,aw/10),ay-8,aw-2*max(15,aw/10),8,"n-resize"); //top middle 510 jg_doc.drawHandle(ax+max(15,aw/10),ay+ah,aw-2*max(15,aw/10),8,"s-resize"); //bottom middle 511 jg_doc.drawHandle(ax-8, ay+max(15,ah/10),8,ah-2*max(15,ah/10),"w-resize"); //left middle 512 jg_doc.drawHandle(ax+aw, ay+max(15,ah/10),8,ah-2*max(15,ah/10),"e-resize"); //right middle 513 514 515 516 jg_doc.drawHandleBox(ax-4,ay-4,8,8,"nw-resize"); //upper left 517 jg_doc.drawHandleBox(ax-4,ay+ah-4,8,8,"sw-resize"); //lower left 518 jg_doc.drawHandleBox(ax+aw-4,ay-4,8,8,"ne-resize"); //upper right 519 jg_doc.drawHandleBox(ax+aw-4,ay+ah-4,8,8,"se-resize"); //lower right 520 521 jg_doc.drawHandleBox(ax+aw/2-4,ay-4,8,8,"n-resize"); //top middle 522 jg_doc.drawHandleBox(ax+aw/2-4,ay+ah-4,8,8,"s-resize"); //bottom middle 523 jg_doc.drawHandleBox(ax-4, ay+ah/2-4,8,8,"w-resize"); //left middle 524 jg_doc.drawHandleBox(ax+aw-4, ay+ah/2-4,8,8,"e-resize"); //right middle 525 526 //jg_doc.paint(); 527 } 528 529 function showStatus() 530 { 531 if(ant == null || ant.style == null) { 532 return false; 533 } 534 535 if(mode == "measure") { 536 //alert(pic_x); 537 mx1 = x - pic_x; 538 my1 = y - pic_y; 539 540 mw = mx2 - x; 541 mh = my2 - y; 542 543 md = parseInt(Math.sqrt(mw*mw + mh*mh)*100)/100; 544 545 ma = (Math.atan(-1*mh/mw)/Math.PI)*180; 546 if(mw < 0 && mh < 0) 547 ma = ma+180; 548 549 if (mw <0 && mh >0) 550 ma = ma - 180; 551 552 ma = parseInt(ma*100)/100; 553 554 if (m_sx != null && !isNaN(mx1)) 555 m_sx.innerHTML = mx1+" px"; 556 if (m_sy != null && !isNaN(my1)) 557 m_sy.innerHTML = my1+" px"; 558 if(m_w != null && !isNaN(mw)) 559 m_w.innerHTML = mw + " px"; 560 if(m_h != null && !isNaN(mh)) 561 m_h.innerHTML = mh + " px"; 562 563 if(m_d != null && !isNaN(md)) 564 m_d.innerHTML = md + " px"; 565 if(m_a != null && !isNaN(ma)) 566 m_a.innerHTML = ma + "° "; 567 568 if(r_ra != null &&!isNaN(ma)) 569 r_ra.value = ma; 570 571 //alert("mx1:"+mx1+" my1"+my1); 572 return false; 573 } 574 575 var ah = parseInt(ant.style.height); 576 var aw = parseInt(ant.style.width); 577 var ax = parseInt(ant.style.left); 578 var ay = parseInt(ant.style.top); 579 580 var cx = ax-pic_x<0?0:ax-pic_x; 581 var cy = ay-pic_y<0?0:ay-pic_y; 582 cx = cx>pic_width?pic_width:cx; 583 cy = cy>pic_height?pic_height:cy; 584 585 var cw = ax-pic_x>0?aw:aw-(pic_x-ax); 586 var ch = ay-pic_y>0?ah:ah-(pic_y-ay); 587 588 ch = ay+ah<pic_y+pic_height?ch:ch-(ay+ah-pic_y-pic_height); 589 cw = ax+aw<pic_x+pic_width?cw:cw-(ax+aw-pic_x-pic_width); 590 591 ch = ch<0?0:ch; cw = cw<0?0:cw; 592 593 if (ant.style.visibility == "hidden") 594 { 595 cx = ""; cy = ""; cw=""; ch=""; 596 } 597 598 if(mode == 'crop') { 599 if(t_cx != null) 600 t_cx.value = cx; 601 if (t_cy != null) 602 t_cy.value = cy; 603 if(t_cw != null) 604 t_cw.value = cw; 605 if (t_ch != null) 606 t_ch.value = ch; 607 } 608 else if(mode == 'scale') { 609 610 var sw = aw, sh = ah; 611 612 if (s_sw.value.indexOf('%')>0 && s_sh.value.indexOf('%')>0) 613 { 614 sw = cw/pic_width; 615 sh = ch/pic_height; 616 } 617 if (s_sw != null) 618 s_sw.value = sw; 619 if (s_sh != null) 620 s_sh.value = sh; 621 } 622 623 } 624 625 function dragStopped() 626 { 627 dragapproved=false; 628 629 if(ant == null || ant.style == null) { 630 return false; 631 } 632 633 if(mode == "measure") { 634 jg_doc.drawLine(x-4,y,x+4,y); 635 jg_doc.drawLine(x,y-4,x,y+4); 636 jg_doc.drawLine(mx2-4,my2,mx2+4,my2); 637 jg_doc.drawLine(mx2,my2-4,mx2,my2+4); 638 639 jg_doc.paint(); 640 showStatus(); 641 return false; 642 } 643 var ah = parseInt(ant.style.height); 644 var aw = parseInt(ant.style.width); 645 var ax = parseInt(ant.style.left); 646 var ay = parseInt(ant.style.top); 647 jg_doc.clear(); 648 649 if(content != null) { 650 if(content.width != null && content.height != null) { 651 content.width = aw-1; 652 content.height = ah-1; 653 } 654 //alert(content.width+":"+content.height); 655 } 656 if(mode == "crop") { 657 //alert(pic_y); 658 jg_doc.fillRectPattern(pic_x,pic_y,pic_width,ay-pic_y,pattern); 659 660 var h1 = ah; 661 var y1 = ay; 662 if (ah+ay >= pic_height+pic_y) 663 h1 = pic_height+pic_y-ay; 664 else if (ay <= pic_y) 665 { 666 h1 = ay+ah-pic_y; 667 y1 = pic_y; 668 } 669 jg_doc.fillRectPattern(pic_x,y1,ax-pic_x,h1,pattern); 670 jg_doc.fillRectPattern(ax+aw,y1,pic_x+pic_width-ax-aw,h1,pattern); 671 jg_doc.fillRectPattern(pic_x,ay+ah,pic_width,pic_height+pic_y-ay-ah,pattern); 672 } 673 else if(mode == "scale") { 674 //alert("Resizing: iw:"+image.width+" nw:"+aw); 675 document.theImage.height = ah; 676 document.theImage.width = aw; 677 document.theImage.style.height = ah+" px"; 678 document.theImage.style.width = aw+" px"; 679 680 P7_Snap('theImage','ant',0,0); 681 682 //alert("After Resizing: iw:"+image.width+" nw:"+aw); 683 } 684 685 drawBoundHandle(); 686 jg_doc.paint(); 687 688 showStatus(); 689 return false; 690 } 691 692 document.onmousedown=drags 693 document.onmouseup=dragStopped; 694
titre
Description
Corps
titre
Description
Corps
titre
Description
Corps
titre
Corps
| Généré le : Sun Feb 25 17:20:01 2007 | par Balluche grâce à PHPXref 0.7 |