Mercurial > laserkard

annotate onlypaths/js/application_mini.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
rev   line source
rlm@46 1
rlm@46 2 /*
rlm@46 3 *
rlm@46 4 */
rlm@46 5
rlm@46 6 Ext.BLANK_IMAGE_URL = 'theme/images/default/s.gif';
rlm@46 7
rlm@46 8 if(typeof console != 'object') {
rlm@46 9 console = {};
rlm@46 10 console.log = function(){return false;};
rlm@46 11 }
rlm@46 12
rlm@46 13
rlm@46 14 function $(e){return Ext.get(e).dom}
rlm@46 15 var c, browser, browserpath;
rlm@46 16 var colorpage="#ccccdd";
rlm@46 17 var colorpage1a="#ee00aa"; //north
rlm@46 18 var colorpage1b="#ee00cc";
rlm@46 19 var colorpage1c="#ee00ee";
rlm@46 20 var colorpage2="#77aaaa"; //sud
rlm@46 21 var colorpage3="#ddee00"; //est
rlm@46 22 var colorpage4="#ccee00"; //west
rlm@46 23
rlm@46 24 var selectmode='';
rlm@46 25 var selectedit='';
rlm@46 26
rlm@46 27
rlm@46 28 ie = navigator.appVersion.match(/MSIE (\d\.\d)/);
rlm@46 29 opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
rlm@46 30
rlm@46 31
rlm@46 32
rlm@46 33 window.onresize = doResize;
rlm@46 34 var initialFile='big01.txt';
rlm@46 35 var docx=0;
rlm@46 36 var docy=0;
rlm@46 37 var docw=600;
rlm@46 38 var doch=400;
rlm@46 39 var canvasWidth=600;//FRONTsize[0];
rlm@46 40 var canvasW=canvasWidth;
rlm@46 41 var canvasHeight=400;//FRONTsize[1];
rlm@46 42 var canvasH=canvasHeight;
rlm@46 43 var canvasX=0;
rlm@46 44 var canvasY=0;
rlm@46 45 var zoomx=docx;
rlm@46 46 var zoomy=docy;
rlm@46 47 var zoomw=docw;
rlm@46 48 var zoomh=doch;
rlm@46 49 var marginx=0;
rlm@46 50 var marginy=0;
rlm@46 51 var margin=100;
rlm@46 52 var screenSize=myWorkSize();
rlm@46 53 var scrW = screenSize[0];//screen.availWidth;
rlm@46 54 var scrH = screenSize[1];//screen.availHeight;
rlm@46 55
rlm@46 56 var canvasYpercent=100;
rlm@46 57 var canvasXpercent=100;
rlm@46 58
rlm@46 59
rlm@46 60 //?
rlm@46 61 var wndW=scrW;//window.width;
rlm@46 62 var wndH=scrH;//window.height;
rlm@46 63 //
rlm@46 64 var proporWindow= scrW/scrH;
rlm@46 65 var proporCanvas=canvasW/canvasH;
rlm@46 66 var proporDoc=docw/doch;
rlm@46 67 var proporZoom= zoomw/zoomh;
rlm@46 68 var proporx=proporCanvas; //IE
rlm@46 69 var propory=1; //IE
rlm@46 70 var mode='canvas';//'canvas' or 'preview'
rlm@46 71
rlm@46 72 var zoominit=docx+' '+docy+' '+docw+' '+doch;
rlm@46 73 var zoominit1 =zoominit;
rlm@46 74 var zoominit2 =zoominit;
rlm@46 75
rlm@46 76 var fieldViewx=Math.round(canvasH*proporCanvas);
rlm@46 77 var fieldViewy=canvasH;
rlm@46 78 var diagonalFrame=dist2p(0,0,fieldViewx,fieldViewy);
rlm@46 79 var diagonalAngle=getAngle(fieldViewx,fieldViewy);
rlm@46 80 var diagonalinit=diagonalFrame;
rlm@46 81 //alert(diagonalinit);
rlm@46 82
rlm@46 83 // double?
rlm@46 84 var diagonalMidx=fieldViewx/2;
rlm@46 85 var diagonalMidy=fieldViewy/2;
rlm@46 86 var centerZoomx=diagonalMidx;//Math.round(zoomw/2);
rlm@46 87 var centerZoomy=diagonalMidy;//Math.round(zoomh/2);
rlm@46 88 //
rlm@46 89
rlm@46 90
rlm@46 91 var proporDiagonal=diagonalFrame/diagonalinit;
rlm@46 92 //////////////////////////
rlm@46 93
rlm@46 94 var wProportion={x:35, y:24}
rlm@46 95
rlm@46 96 var vertexNORTHmenu={};
rlm@46 97 var vertexNORTHglobals={};
rlm@46 98 var vertexNORTHoptions={};
rlm@46 99 var vertexSUD={};
rlm@46 100 var vertexEST={};
rlm@46 101 var vertexWEST={};
rlm@46 102 var vertexFRONT={};
rlm@46 103
rlm@46 104 var NORTHmenusize=[];
rlm@46 105 var NORTHglobalssize=[];
rlm@46 106 var NORTHoptionssize=[];
rlm@46 107 var SUDsize=[];
rlm@46 108 var ESTsize=[];
rlm@46 109 var WESTsize=[];
rlm@46 110 var FRONTsize=[];
rlm@46 111
rlm@46 112
rlm@46 113 vertexFrames();
rlm@46 114
rlm@46 115
rlm@46 116 var FRONT='';
rlm@46 117 FRONT+=' <div id="richdraw" style="background-image:url();background-color:#ff0000;position:relative; border:0px outset black;left:'+canvasX+'px;top:'+canvasY+'px;width:'+canvasW+'px;height:'+canvasH+'px; "></div>';
rlm@46 118
rlm@46 119 var NORTHmenu='';
rlm@46 120 NORTHmenu+='&nbsp;&nbsp;<span id="file">File</span>&nbsp;&nbsp;<span id="edit">Edit</span>';
rlm@46 121
rlm@46 122 var NORTHglobals='';
rlm@46 123 NORTHglobals+='<span id="options_select" style="visibility:visible;position:relative;top:0px;left:'+canvasX+'px; padding:1px; margin-top:1px; background-color:tranparent;">';
rlm@46 124 NORTHglobals+=' <img id="select_deleteone" title="Delete one" onclick="selectedit='+"'"+'deleteone'+"'"+';info_select()" src="img/delete.gif" >';
rlm@46 125 NORTHglobals+=' <img id="select_deleteall" title="Delete all" onclick="selectedit='+"'"+'deleteall'+"'"+';info_select()" src="img/reset.gif" >'
rlm@46 126 NORTHglobals+=' <img id="select_tothetop" title="To the top" onclick="selectedit='+"'"+'tothetop'+"'"+';info_select()" src="img/tothetop.gif" >';
rlm@46 127 NORTHglobals+=' <img id="select_totheback" title="To the back" onclick="selectedit='+"'"+'totheback'+"'"+';info_select()" src="img/totheback.gif" >';
rlm@46 128 NORTHglobals+=' <img id="select_onetop" title="One top" onclick="selectedit='+"'"+'onetop'+"'"+';info_select()" src="img/onetop.gif" >';
rlm@46 129 NORTHglobals+=' <img id="select_oneback" title="One back" onclick="selectedit='+"'"+'oneback'+"'"+';info_select()" src="img/oneback.gif" >';
rlm@46 130 NORTHglobals+=' <img id="select_reflectV" title="Vertical reflect" onclick="selectedit='+"'"+'reflectV'+"'"+';info_select()" src="img/reflect_h.gif" >',
rlm@46 131 NORTHglobals+=' <img id="select_reflectH" title="Horizontal reflect" onclick="selectedit='+"'"+'reflectH'+"'"+';info_select()" src="img/reflect_v.gif" >';
rlm@46 132 NORTHglobals+='</span>';
rlm@46 133
rlm@46 134 var NORTHoptions='';
rlm@46 135 // <!-- OPTIONS_SELECT_PATH -->
rlm@46 136 NORTHoptions+='<div id="options_select_path" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:5px;height:14px;width:100%; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 137 NORTHoptions+='<input type="text" name="codebase" id="codebase" style="height:15px;width:600px; padding:1px 1px 1px 4px; margin:0px; background-color:#ffffff;" value=""><img id="envshape" style="background-color:orange;" align="top" title="Submit Shape" onclick="setShape();" border="0px" src="img/setpath1.gif">';
rlm@46 138 NORTHoptions+='</div>';
rlm@46 139 // <!-- OPTIONS_RECT -->
rlm@46 140 NORTHoptions+='<div id="options_rect" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:5px;height:14px;width:100%; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 141 NORTHoptions+=' trX<input id="option_rect_trx" type="text" size="1" style="background-color:#ffffdd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 142 NORTHoptions+=' trY<input id="option_rect_try" type="text" size="1" style="background-color:#ffffdd" value="0"onKeyPress="return edit(this,event)">';
rlm@46 143 NORTHoptions+=' wx<input id="option_rect_sclx" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 144 NORTHoptions+=' wy<input id="option_rect_scly" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 145 NORTHoptions+=' rot<input id="option_rect_rot" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 146 NORTHoptions+='</div>';
rlm@46 147 // <!-- OPTIONS_IMAGE -->
rlm@46 148 NORTHoptions+='<div id="options_image" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:5px;height:14px;width:100%; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 149 NORTHoptions+=' trX<input id="option_img_trx" type="text" size="1" style="background-color:#ffffdd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 150 NORTHoptions+=' trY<input id="option_img_try" type="text" size="1" style="background-color:#ffffdd" value="0"onKeyPress="return edit(this,event)">';
rlm@46 151 NORTHoptions+=' wx<input id="option_img_sclx" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 152 NORTHoptions+=' wy<input id="option_img_scly" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 153 NORTHoptions+=' rot<input id="option_img_rot" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 154 NORTHoptions+=' Source: <input name="option_image_href" type="text" size="62" id="option_image_href" value="http://tavmjong.free.fr/INKSCAPE/MANUAL/images/QUICKSTART/SOUPCAN/SoupCan_SoupedUp.png" onmouseover="" onKeyPress="return edit(this,event)">';
rlm@46 155 NORTHoptions+='</div>';
rlm@46 156 //<!-- OPTIONS_PATH -->
rlm@46 157 NORTHoptions+='<div id="options_path" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:5px;height:14px;width:100%; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 158 NORTHoptions+=' trX<input id="option_path_trx" type="text" size="1" style="background-color:#ffffdd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 159 NORTHoptions+=' trY<input id="option_path_try" type="text" size="1" style="background-color:#ffffdd" value="0"onKeyPress="return edit(this,event)">';
rlm@46 160 NORTHoptions+=' <input id="option_path_sclx" type="hidden" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 161 NORTHoptions+=' <input id="option_path_scly" type="hidden" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 162 NORTHoptions+=' rot<input id="option_path_rot" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 163 NORTHoptions+=' Open/Close: <input CHECKED name="option_path_close" id="option_path_close" type="checkbox">';
rlm@46 164 NORTHoptions+=' <input type="text" name="control_codebase" id="control_codebase" style="height:15px;width:300px; padding:1px 1px 1px 4px; margin:0px; background-color:#ffffff;" onmouseover="" value="" onKeyPress="return edit(this,event)">';
rlm@46 165 NORTHoptions+=' <img style="cursor:pointer" align="top" title="to curve" onclick="c.renderer.tocurve();" src="img/tocurve.gif">';
rlm@46 166 NORTHoptions+=' <input id="option_path_num" type="hidden" size="1" style="background-color:#ffdddd" value="0">';
rlm@46 167 NORTHoptions+=' Px<input id="option_path_x" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return editPath(this,event)">';
rlm@46 168 NORTHoptions+=' Py<input id="option_path_y" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return editPath(this,event)">';
rlm@46 169 NORTHoptions+='</div>';
rlm@46 170 //<!--OPTIONS ELLIPSE-->
rlm@46 171 NORTHoptions+='<div id="options_ellipse" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:5px;height:14px;width:100%; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 172 NORTHoptions+=' trX<input id="option_ellipse_trx" type="text" size="1" style="background-color:#ffffdd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 173 NORTHoptions+=' trY<input id="option_ellipse_try" type="text" size="1" style="background-color:#ffffdd" value="0"onKeyPress="return edit(this,event)">';
rlm@46 174 NORTHoptions+=' wx<input id="option_ellipse_sclx" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 175 NORTHoptions+=' wy<input id="option_ellipse_scly" type="text" size="1" style="background-color:#ddffdd" value="1" onKeyPress="return edit(this,event)">';
rlm@46 176 NORTHoptions+=' rot<input id="option_ellipse_rot" type="text" size="1" style="background-color:#ffdddd" value="0" onKeyPress="return edit(this,event)">';
rlm@46 177 NORTHoptions+='</div>';
rlm@46 178 //<!-- OPTIONS_ZOOM -->
rlm@46 179 NORTHoptions+='<div id="options_zoom" style="font-size:9px;visibility:hidden;position:relative;top:0px;left:'+canvasX+'px; padding:0px; margin-top:0px; background-color:tranparent;">';
rlm@46 180 NORTHoptions+=' <img id="zoom_more" title="More zoom" onclick="zoommode='+"'"+'more'+"'"+';info_zoom()" src="img/zoom_more.gif" >';
rlm@46 181 NORTHoptions+=' <img id="zoom_minus" title="Minus zoom" onclick="zoommode='+"'"+'minus'+"'"+';info_zoom()" src="img/zoom_minus.gif" >';
rlm@46 182 NORTHoptions+=' <img id="zoom_frame" title="Frame zoom" onclick="zoommode='+"'"+'frame'+"'"+';info_zoom()" src="img/zoom_frame.gif" >';
rlm@46 183 NORTHoptions+=' <img id="zoom_window" title="Window zoom" onclick="zoommode='+"'"+'window'+"'"+';info_zoom()" src="img/zoom_window.gif" >';
rlm@46 184 NORTHoptions+=' <img id="zoom_hand" title="Hand zoom" onclick="zoommode='+"'"+'hand'+"'"+';info_zoom()" src="img/zoom_hand.gif" >';
rlm@46 185 NORTHoptions+='</div>';
rlm@46 186 //<!-- OPTIONS TEXT-->
rlm@46 187 NORTHoptions+='<div id="options_text" style="font-size:9px;visibility:hidden;position:absolute;top:0px;left:90px;width:100%; padding:1px; margin-top:1px;z-index:200; background-color:transparent;">';
rlm@46 188 NORTHoptions+=' <input name="option_text_message" type="text" size="22" id="option_text_message" value="My text" onKeyPress="return edit(this,event)" style="visibility:inherit!important" />';
rlm@46 189 NORTHoptions+=' Size:<input type="text" size="3" id="option_text_size" name="option_text_size" value="30" onKeyPress="return edit(this,event)" style="">';
rlm@46 190 NORTHoptions+=' Family:<select id="select_option_text_family" name="select_option_text_family" onchange="setTextFamily(this);" style="font-size:9px;">';
rlm@46 191 NORTHoptions+=' <option style="font-family:Arial;" value="Arial">Arial</option>';
rlm@46 192 NORTHoptions+=' <option style="font-family:Verdana;" value="Verdana">Verdana</option>';
rlm@46 193 NORTHoptions+=' <option style="font-family:Times;" value="Times">Times</option>';
rlm@46 194 NORTHoptions+=' <option style="font-family:Times;" value="Tahoma">Tahoma</option>';
rlm@46 195 NORTHoptions+=' <option style="font-family:Times;" value="Impact">Impact</option>';
rlm@46 196 NORTHoptions+=' </select>';
rlm@46 197 NORTHoptions+=' <input type="hidden" name="option_text_family" id="option_text_family" value="Arial" >';
rlm@46 198 NORTHoptions+='</div>';
rlm@46 199
rlm@46 200
rlm@46 201 var EST='';
rlm@46 202 EST+='<img id="select" title="Select shapes" onclick="c.pathsEdit=false; setMode('+"'"+'select'+"'"+', '+"'"+'Selection'+"'"+');" src="img/select3.gif" >';
rlm@46 203 EST+='<img id="pathsEdit" title="Edit path" onclick="c.pathsEdit=true; setMode('+"'"+'pathsEdit'+"'"+', '+"'"+'Path Edit'+"'"+');" src="img/editpath.gif" >';
rlm@46 204 EST+='<img id="zoom" title="Select zoom" onclick="setMode('+"'"+'zoom'+"'"+', '+"'"+'Zoom'+"'"+');" src="img/zoom.gif" >';
rlm@46 205 EST+='<img id="rect" title="Draw a rectangle" onclick="setMode('+"'"+'rect'+"'"+', '+"'"+'Rectangle'+"'"+');" src="img/rectangle.gif" >';
rlm@46 206 EST+='<img id="roundrect" title="Draw a rounded rectangle" onclick="setMode('+"'"+'roundrect'+"'"+', '+"'"+'Rounded Rectangle'+"'"+');" src="img/roundrect.gif" >';
rlm@46 207 EST+='<img id="ellipse" title="Draw an ellipse" onclick="setMode('+"'"+'ellipse'+"'"+', '+"'"+'Ellipse / Circle'+"'"+');" src="img/circle.gif" >';
rlm@46 208 EST+='<img id="line" title="Draw a line" onclick="setMode('+"'"+'line'+"'"+', '+"'"+'Line'+"'"+');" src="img/line.gif" >';
rlm@46 209 EST+='<img id="path" title="Draw a path" onclick="setMode('+"'"+'path'+"'"+', '+"'"+'Path'+"'"+');" src="img/path2.gif">';
rlm@46 210 EST+='<img id="controlpath" title="Draw a path" onclick="setMode('+"'"+'controlpath'+"'"+', '+"'"+'controlPath'+"'"+');" src="img/path3.gif">';
rlm@46 211 EST+='<img id="text" title="Write a text" onclick="setMode('+"'"+'text'+"'"+', '+"'"+'Text'+"'"+');" src="img/text.gif">';
rlm@46 212 EST+='<img id="shape" title="Open a shape" onclick="setMode('+"'"+'shape'+"'"+', '+"'"+'Shape'+"'"+');" src="img/shape.gif">';
rlm@46 213 EST+='<img id="image" title="Put a image" onclick="setMode('+"'"+'image'+"'"+', '+"'"+'Image'+"'"+');" src="img/image.gif" >';
rlm@46 214
rlm@46 215 var WEST='';
rlm@46 216 WEST+='<div id="xyinput" style="width:40px;background-color:none">0,0</div>';
rlm@46 217 WEST+='<div style="font-size:9px">Grid:</div>';
rlm@46 218 WEST+='<select id="gridwidth" style="font-size:9px">';
rlm@46 219 var chain='';
rlm@46 220 for(var num=1;num<=30;num++)
rlm@46 221 {
rlm@46 222 chain+='<option value="'+num+'">'+num+'px</option>';
rlm@46 223 }
rlm@46 224 WEST+=chain;
rlm@46 225 WEST+='</select>';
rlm@46 226 WEST+='<br>';
rlm@46 227
rlm@46 228 WEST+=' <div name="me-container">';
rlm@46 229 WEST+=' <div id="fill-me">';
rlm@46 230 WEST+=' <img style=" padding:0px; border:0px solid orange;" id="img_okfill" onclick="setbe(1,'+"'"+'img_okfill'+"'"+')" src="img/theme/images/ok.gif">Fill<div id="fill-square"></div>';
rlm@46 231 WEST+=' <div id="slider-fill"></div>';
rlm@46 232 WEST+=' <div id="fillContainer"></div>';
rlm@46 233 WEST+=' <div id="opacity-slider-fill" title="Fill opacity"></div>';
rlm@46 234 WEST+=' </div>';
rlm@46 235 WEST+=' <div id="stroke-me">';
rlm@46 236 WEST+=' <img style=" padding:0px; border:0px solid orange;" id="img_okstroke" onclick="setbe(2,'+"'"+'img_okstroke'+"'"+')" src="img/theme/images/ok.gif">Line<div id="stroke-square"></div>';
rlm@46 237 WEST+=' <div id="slider-stroke"></div>';
rlm@46 238 WEST+=' <div id="strokeContainer"></div>';
rlm@46 239 WEST+=' <div id="width-slider-stroke-mask"></div><div id="width-slider-stroke" title="Stroke width"></div>';
rlm@46 240 WEST+=' <div id="opacity-slider-stroke" title="Stroke opacity"></div>';
rlm@46 241 WEST+=' </div>';
rlm@46 242 WEST+=' <div id="divformfill">';
rlm@46 243 WEST+=' </div>';
rlm@46 244 WEST+=' <div id="divformstroke">';
rlm@46 245 WEST+=' </div>';
rlm@46 246
rlm@46 247 WEST+='</div>';
rlm@46 248 WEST+=' <div id="panel_shapes" style="overflow:auto;font-size:9px;visibility:hidden;position:absolute;top:200px;left:0px;height:122px;width:200px; padding:1px; margin-top:1px; background-color:none;">';
rlm@46 249 WEST+=' <iframe id="linksPaths" style="visibility:hidden;overflow:auto;padding:0px;border-style:outset;border-width:0px;margin:0px;width:200px;height:122px;background-color:wheat;" src="svgpaths.htm"></iframe>';
rlm@46 250 WEST+=' </div> ';
rlm@46 251
rlm@46 252 var SUD="";
rlm@46 253 //SUD+='<img id="showcode" title="Show the code" alt="" onclick="showMarkupCode();" src="img/viewcode.gif" style="border-color:#dd7700" >';
rlm@46 254 //SUD+='<img id="showmarkup" title="Show the raw markup" alt="" onclick="shm();" src="img/viewcode.gif" >';
rlm@46 255 //SUD+='<img id="loadmarkup" title="Load the raw markup" alt="" onclick="lcm();" src="img/loadcode.gif" >';
rlm@46 256 //SUD+='<br>&nbsp;';
rlm@46 257 SUD+='<br>&nbsp;';
rlm@46 258 SUD+='<input type="text" id="someinfo" value="No Data" name="someinfo" style="width:80%;">';
rlm@46 259 // SUD+='<textarea name="code" id="code" style="width:420px;height:200px;padding:0px"></textarea>';
rlm@46 260 // SUD+='<div>';
rlm@46 261 // SUD+='</div>';
rlm@46 262
rlm@46 263 var currentEditStatus='off';
rlm@46 264 var currentFileStatus='off';
rlm@46 265 var infoFrame, docFrame;
rlm@46 266 Ext.onReady(function() {
rlm@46 267
rlm@46 268
rlm@46 269 //var map = new Ext.KeyMap(document, {
rlm@46 270 // key: [Ext.EventObject.LEFT, Ext.EventObject.RIGHT],
rlm@46 271 // ctrl: true,
rlm@46 272 // fn: keypresshandler
rlm@46 273 //});
rlm@46 274 Ext.get("FRONT").dom.innerHTML=(FRONT);
rlm@46 275 Ext.get("NORTHmenu").dom.innerHTML=(NORTHmenu);
rlm@46 276 Ext.get("NORTHglobals").dom.innerHTML=(NORTHglobals);
rlm@46 277 Ext.get("NORTHoptions").dom.innerHTML=(NORTHoptions);
rlm@46 278 Ext.get("EST").dom.innerHTML=(EST);
rlm@46 279 Ext.get("WEST").dom.innerHTML=(WEST);
rlm@46 280 Ext.get("SUD").dom.innerHTML=(SUD);
rlm@46 281
rlm@46 282 resizeFrame();
rlm@46 283 var map= new Ext.KeyMap(document, [
rlm@46 284 {
rlm@46 285 key: [46],//DELETE
rlm@46 286 fn: function(){ c.deleteSelection(); }
rlm@46 287 }, {
rlm@46 288 key: "x",
rlm@46 289 ctrl:true,
rlm@46 290 fn: function(){
rlm@46 291 c.clipboard=c.renderer.copy(c.selected);
rlm@46 292 c.deleteSelection();
rlm@46 293 }
rlm@46 294 }, {
rlm@46 295 key: "c",
rlm@46 296 ctrl:true,
rlm@46 297 fn: function(){
rlm@46 298 c.clipboard=c.renderer.copy(c.selected);
rlm@46 299 }
rlm@46 300 }, {
rlm@46 301 key: "d",
rlm@46 302 ctrl:true,
rlm@46 303 fn: function(){
rlm@46 304 c.selected=c.renderer.duplicate(c.selected);
rlm@46 305 c.selected.id = 'shape:' + createUUID();
rlm@46 306 Ext.get(c.selected).on( "mousedown", c.onHit,c);
rlm@46 307 }
rlm@46 308 }, {
rlm@46 309 key: "v",
rlm@46 310 ctrl:true,
rlm@46 311 fn: function(){
rlm@46 312 c.selected=c.renderer.paste(c.clipboard,c.mouseDownX,c.mouseDownY);
rlm@46 313 c.selected.id = 'shape:' + createUUID();
rlm@46 314 Ext.get(c.selected).on( "mousedown", c.onHit,c);
rlm@46 315 }
rlm@46 316 }, {
rlm@46 317 key: "z", //UNDO
rlm@46 318 ctrl:true,
rlm@46 319 shift:false,
rlm@46 320 fn: function(){ c.clipboard=c.renderer.undo(); }
rlm@46 321 }
rlm@46 322 ]);
rlm@46 323
rlm@46 324 /*
rlm@46 325 Ext.get("richdraw").dom.style.width=(canvasWidth);
rlm@46 326 Ext.get("richdraw").dom.style.height=(canvasHeight);
rlm@46 327 Ext.get("richdraw").dom.style.left=(canvasX);
rlm@46 328 Ext.get("richdraw").dom.style.top=(canvasY);
rlm@46 329 */
rlm@46 330
rlm@46 331
rlm@46 332
rlm@46 333 menuEdit = new Ext.menu.Menu({
rlm@46 334 id: 'menuedit',
rlm@46 335 items: [
rlm@46 336 {icon: "img/viewcode.gif", text: 'Copy all ', handler: shm},
rlm@46 337 {icon: "img/viewcode.gif", text: 'Paste all ', handler: lcm},
rlm@46 338 {icon: "img/viewcode.gif", text: 'Delete all ', handler: deleteAllShapes},
rlm@46 339 {icon: "img/viewcode.gif", text: 'Duplicate&nbsp;&nbsp;<b>Ctrl+d</b>', handler: duplicateSelected},
rlm@46 340 {icon: "img/viewcode.gif", text: 'Cut&nbsp;&nbsp;&nbsp;&nbsp;<b>Ctrl+x</b>', handler: cutSelected},
rlm@46 341 {icon: "img/viewcode.gif", text: 'Copy&nbsp;&nbsp;&nbsp;&nbsp;<b>Ctrl+c</b>', handler: copySelected},
rlm@46 342 {icon: "img/viewcode.gif", text: 'Paste&nbsp;&nbsp;<b>Ctrl+v</b>', handler: pasteSelected},
rlm@46 343 {icon: "img/viewcode.gif", text: 'Delete&nbsp;&nbsp;&nbsp;<b>Supr</b>', handler: deleteShape},
rlm@46 344 {icon: "img/viewcode.gif", text: 'Delete last&nbsp;<b>Ctrl+z</b>', handler: deleteLastShapes},
rlm@46 345
rlm@46 346 ]
rlm@46 347 });
rlm@46 348
rlm@46 349 menuFile = new Ext.menu.Menu({
rlm@46 350 id: 'menufile',
rlm@46 351
rlm@46 352 items: [
rlm@46 353 new Ext.menu.Item({ icon: "img/viewcode.gif", text: 'Open ', handler: openFile }),
rlm@46 354 new Ext.menu.Item({ icon: "img/viewcode.gif", text: 'View SVG code ', handler: showMarkupCode }),
rlm@46 355 new Ext.menu.Item({icon: "img/viewcode.gif", text: 'View OPF code ', handler: showMarkup }),
rlm@46 356 new Ext.menu.Item({icon: "img/viewcode.gif", text: 'Document properties ', handler: documentProperties })
rlm@46 357 ]
rlm@46 358 });
rlm@46 359 /*
rlm@46 360 items: [
rlm@46 361 {icon: "img/viewcode.gif", text: 'View SVG code ', handler: showMarkupCode },
rlm@46 362 {icon: "img/viewcode.gif", text: 'View OPF code ', handler: showMarkup },
rlm@46 363 {icon: "img/viewcode.gif", text: 'Document properties ', handler: documentProperties },
rlm@46 364
rlm@46 365 ]
rlm@46 366 */
rlm@46 367 // define the handler for mouseover/out of either button or menu itself
rlm@46 368 var editHandler = function(e)
rlm@46 369 {
rlm@46 370 if(currentEditStatus=='on')
rlm@46 371 {
rlm@46 372 var edit = menuEdit.getEl();
rlm@46 373 var buttonEdit = Ext.get('edit');
rlm@46 374 if(!edit.getRegion().contains(e.getPoint()) && !buttonEdit.getRegion().contains(e.getPoint()))
rlm@46 375 {
rlm@46 376 menuEdit.hide();
rlm@46 377 currentEditStatus='off';
rlm@46 378 }
rlm@46 379 }
rlm@46 380 else
rlm@46 381 {
rlm@46 382 menuEdit.show('edit');
rlm@46 383 currentEditStatus='on';
rlm@46 384 }
rlm@46 385 }
rlm@46 386
rlm@46 387 var fileHandler = function(e)
rlm@46 388 {
rlm@46 389 if(currentFileStatus=='on')
rlm@46 390 {
rlm@46 391 var file = menuFile.getEl();
rlm@46 392 var buttonFile = Ext.get('file');
rlm@46 393 if(!file.getRegion().contains(e.getPoint()) && !buttonFile.getRegion().contains(e.getPoint()))
rlm@46 394 {
rlm@46 395 menuFile.hide();
rlm@46 396 currentFileStatus='off';
rlm@46 397 }
rlm@46 398 }
rlm@46 399 else
rlm@46 400 {
rlm@46 401 menuFile.show('file');
rlm@46 402 currentFileStatus='on';
rlm@46 403 }
rlm@46 404 }
rlm@46 405
rlm@46 406 // define the events to observe
rlm@46 407 Ext.get('edit').on('mouseover',editHandler);
rlm@46 408 Ext.get('edit').on('mouseout',editHandler);
rlm@46 409 menuEdit.getEl().on('mouseout',editHandler);
rlm@46 410
rlm@46 411 Ext.get('file').on('mouseover',fileHandler);
rlm@46 412 Ext.get('file').on('mouseout',fileHandler);
rlm@46 413 menuFile.getEl().on('mouseout',fileHandler);
rlm@46 414
rlm@46 415
rlm@46 416
rlm@46 417
rlm@46 418 });
rlm@46 419
rlm@46 420 // end ONREADY
rlm@46 421
rlm@46 422 function borderDoc(){
rlm@46 423 //c.rectCanvas(docx,docy,docw,doch,viewBox)
rlm@46 424 if(mode=='canvas')
rlm@46 425 {
rlm@46 426 var obj=document.getElementById("rectDoc");
rlm@46 427 if(obj){c.renderer.remove(obj) }
rlm@46 428 c.renderer.rectDoc(zoominit1);
rlm@46 429 //pst.id = "rectCanvas";
rlm@46 430 //c.selected=obj;
rlm@46 431 // c.renderer.remove(obj)
rlm@46 432 //var clip=c.renderer.copy(obj);
rlm@46 433
rlm@46 434
rlm@46 435
rlm@46 436 //var pst=c.container.appendChild( clip );
rlm@46 437 //c.renderer.paste(clip,0,0);
rlm@46 438 //pst.id = "rectCanvas";
rlm@46 439
rlm@46 440
rlm@46 441 //pasteSelected();
rlm@46 442
rlm@46 443 //c.renderer.duplicate(document.getElementById("rectCanvas"))
rlm@46 444 //c.renderer.remove(document.getElementById("rectCanvas"));
rlm@46 445 }
rlm@46 446 }
rlm@46 447 function demo() {
rlm@46 448 _dom=document.all?3:(document.getElementById?1:(document.layers?2:0));
rlm@46 449
rlm@46 450 var renderer;
rlm@46 451
rlm@46 452 if ((!ie) || (opera)) {
rlm@46 453 renderer = new SVGRenderer();
rlm@46 454 browser='svg';
rlm@46 455 browserpath="linkspath.htm";
rlm@46 456 }
rlm@46 457 else {
rlm@46 458 renderer = new VMLRenderer();
rlm@46 459 browser='vml';
rlm@46 460 browserpath="vmlpaths.htm";
rlm@46 461 }
rlm@46 462
rlm@46 463 c = new RichDrawEditor(document.getElementById('richdraw'), renderer);
rlm@46 464
rlm@46 465 c.onInputXY = function(x,y){$('xyinput').innerHTML = parseInt(x)+','+parseInt(y)}//[x,y].join("<br>")}
rlm@46 466
rlm@46 467 c.onselect = onSelect;
rlm@46 468 c.onunselect = onUnselect;
rlm@46 469
rlm@46 470
rlm@46 471
rlm@46 472 // c.onkeydown = keypresshandler;
rlm@46 473 //c.onkeypress = c.onKeyPress;
rlm@46 474 //document.onkeypress = c.onKeyPress;
rlm@46 475
rlm@46 476
rlm@46 477
rlm@46 478 c.editCommand('fillcolor', 'red');
rlm@46 479 c.editCommand('linecolor', 'black');
rlm@46 480 c.editCommand('linewidth', '1px');
rlm@46 481
rlm@46 482
rlm@46 483 //setMode('path', 'Path');
rlm@46 484 setMode('select', 'Selection');
rlm@46 485
rlm@46 486 document.body.style.backgroundColor = colorpage;
rlm@46 487
rlm@46 488
rlm@46 489 //alert(vertexSUD.SUD1[0]+' '+vertexSUD.SUD1[1]+ '--'+wndW+' '+wndH);
rlm@46 490
rlm@46 491 setTimeout(loadDemo,500)
rlm@46 492 //Ext.get("richdraw").on('keydown', function(e){alert('dfsd'); }, false);
rlm@46 493 //Ext.get("richdraw").on('keydown', function(e){alert(e.keyCode); });
rlm@46 494 //document.onkeydown = keypresshandler;
rlm@46 495 //richdraw.svgRoot.setAttributeNS(null,'viewBox', '0 0 700 500');
rlm@46 496
rlm@46 497 //setTimeout(borderDoc,500)
rlm@46 498
rlm@46 499 } //END demo
rlm@46 500
rlm@46 501
rlm@46 502 /////////////////
rlm@46 503
rlm@46 504
rlm@46 505 //////////////////
rlm@46 506 var Docs = function(){
rlm@46 507 return {
rlm@46 508 init : function(){
rlm@46 509 var loading = Ext.get('loading');
rlm@46 510 var mask = Ext.get('loading-mask');
rlm@46 511 mask.setOpacity(.7);
rlm@46 512 mask.shift({
rlm@46 513 xy:loading.getXY(),
rlm@46 514 width:loading.getWidth(),
rlm@46 515 height:loading.getHeight(),
rlm@46 516 remove:true,
rlm@46 517 duration:2,
rlm@46 518 opacity:.8,
rlm@46 519 easing:'bounceOut',
rlm@46 520 callback : function(){
rlm@46 521 loading.fadeOut({duration:.2,remove:true});
rlm@46 522 }
rlm@46 523 });
rlm@46 524 }
rlm@46 525 };
rlm@46 526 }();
rlm@46 527
rlm@46 528
rlm@46 529 Ext.onReady(Docs.init, Docs, true);
rlm@46 530
rlm@46 531 function showinfoFrame(wtitle) {
rlm@46 532 var win = new Ext.Window({
rlm@46 533 closeAction: 'hide',
rlm@46 534 renderTo: 'showInfo',
rlm@46 535 autoScroll:true,
rlm@46 536 modal:true,
rlm@46 537 width: '440',
rlm@46 538 height:'300',
rlm@46 539 x: '120',
rlm@46 540 y: '40',
rlm@46 541 title: wtitle,
rlm@46 542 draggable :true,
rlm@46 543 html: '',
rlm@46 544 hidden: true,
rlm@46 545 contentEl: 'divCode',
rlm@46 546 collapsed: true
rlm@46 547
rlm@46 548 });
rlm@46 549 win.show();
rlm@46 550 }
rlm@46 551 function showdocFrame(wtitle) {
rlm@46 552 var win = new Ext.Window({
rlm@46 553 closeAction: 'hide',
rlm@46 554 renderTo: 'showInfo',
rlm@46 555 width: '340',
rlm@46 556 height:'300',
rlm@46 557 x: '120',
rlm@46 558 y: '40',
rlm@46 559 title: wtitle,
rlm@46 560 draggable :true,
rlm@46 561 html: '',
rlm@46 562 hidden: true,
rlm@46 563 contentEl: 'docProperties',
rlm@46 564 collapsed: true
rlm@46 565
rlm@46 566 });
rlm@46 567 win.show();
rlm@46 568 }
rlm@46 569 function showopenFile(wtitle) {
rlm@46 570 var win = new Ext.Window({
rlm@46 571 autoScroll:true,
rlm@46 572 closeAction: 'hide',
rlm@46 573 renderTo: 'showInfo',
rlm@46 574 width: '440',
rlm@46 575 height:'300',
rlm@46 576 x: '120',
rlm@46 577 y: '40',
rlm@46 578 title: wtitle,
rlm@46 579 draggable :true,
rlm@46 580 html: '',
rlm@46 581 hidden: true,
rlm@46 582 contentEl: 'divopenFile',
rlm@46 583 collapsed: true
rlm@46 584
rlm@46 585 });
rlm@46 586 win.show();
rlm@46 587 }
rlm@46 588
rlm@46 589 /////////////////////////////
rlm@46 590 //FUNCTIONS
rlm@46 591 /////////////////////////////
rlm@46 592
rlm@46 593 function changeInitialFile()
rlm@46 594 {
rlm@46 595 initialFile=document.forms[0].file.value;
rlm@46 596 c.renderer.removeAll()
rlm@46 597 loadDemo();
rlm@46 598
rlm@46 599 }
rlm@46 600
rlm@46 601 function setMode(mode, status)
rlm@46 602 {
rlm@46 603
rlm@46 604
rlm@46 605 selectmode=mode;
rlm@46 606 if(mode=='shape')
rlm@46 607 {
rlm@46 608 c.editCommand('mode', 'select');
rlm@46 609 }else{
rlm@46 610 if(mode=='pathsEdit' )
rlm@46 611 {
rlm@46 612 mode='select';
rlm@46 613 }
rlm@46 614 c.editCommand('mode', mode);
rlm@46 615 }
rlm@46 616
rlm@46 617 var imgs = $('EST').getElementsByTagName('img');
rlm@46 618
rlm@46 619 for (var i=0; i<imgs.length; i++)
rlm@46 620 {
rlm@46 621 imgs[i].style.backgroundColor = '';
rlm@46 622 }
rlm@46 623 if(c.pathsEdit==true){
rlm@46 624 $('pathsEdit').style.backgroundColor = 'orange';
rlm@46 625 }else{
rlm@46 626 $(mode).style.backgroundColor = 'orange';
rlm@46 627 }
rlm@46 628
rlm@46 629
rlm@46 630 if (mode == 'select')
rlm@46 631 {
rlm@46 632 //$('status').innerHTML = 'Select/Move' ;
rlm@46 633 info_select();
rlm@46 634 }
rlm@46 635 else
rlm@46 636 {
rlm@46 637 //$('status').innerHTML = 'Draw ' + status;
rlm@46 638 }
rlm@46 639
rlm@46 640 ///////////
rlm@46 641
rlm@46 642 hiddenAllMenus();
rlm@46 643
rlm@46 644 if(mode=='text')
rlm@46 645 {
rlm@46 646 info_text();
rlm@46 647 }
rlm@46 648
rlm@46 649 if(mode=='shape')
rlm@46 650 {
rlm@46 651 info_shape();
rlm@46 652 }
rlm@46 653 if(mode=='ellipse')
rlm@46 654 {
rlm@46 655 info_ellipse();
rlm@46 656 }
rlm@46 657
rlm@46 658 if(mode=='rect')
rlm@46 659 {
rlm@46 660 info_rect();
rlm@46 661 }
rlm@46 662
rlm@46 663 if(mode=='image')
rlm@46 664 {
rlm@46 665 info_image();
rlm@46 666 }
rlm@46 667
rlm@46 668 if(mode=='path')
rlm@46 669 {
rlm@46 670 info_path();
rlm@46 671 }
rlm@46 672 if(mode=='controlpath')
rlm@46 673 {
rlm@46 674 info_controlpath();
rlm@46 675 }
rlm@46 676 if(mode=='zoom')
rlm@46 677 {
rlm@46 678 info_zoom();
rlm@46 679
rlm@46 680 }
rlm@46 681 if(mode=='select')
rlm@46 682 {
rlm@46 683 if(c.pathsEdit==true)
rlm@46 684 {
rlm@46 685 info_pathsEdit();
rlm@46 686 }
rlm@46 687 else
rlm@46 688 {
rlm@46 689 info_select();
rlm@46 690 }
rlm@46 691
rlm@46 692 }
rlm@46 693 //c.renderer.zoom(0,0);
rlm@46 694 //document.getElementById('richdraw').focus();
rlm@46 695
rlm@46 696 }
rlm@46 697
rlm@46 698 /////////////////////////
rlm@46 699
rlm@46 700 function hiddenAllMenus()
rlm@46 701 {
rlm@46 702 document.getElementById('richdraw').style.cursor='default';
rlm@46 703 $('options_text').style.visibility = 'hidden';
rlm@46 704 $('options_select_path').style.visibility = 'hidden';
rlm@46 705 $('panel_shapes').style.visibility = 'hidden';
rlm@46 706 $('linksPaths').style.visibility = 'hidden';
rlm@46 707 $('options_rect').style.visibility = 'hidden';
rlm@46 708 $('options_ellipse').style.visibility = 'hidden';
rlm@46 709 $('options_image').style.visibility = 'hidden';
rlm@46 710 $('options_path').style.visibility = 'hidden';
rlm@46 711 //$('options_controlpath').style.visibility = 'hidden';
rlm@46 712 $('options_zoom').style.visibility = 'hidden';
rlm@46 713 $('options_select').style.visibility = 'hidden';
rlm@46 714
rlm@46 715
rlm@46 716 selectedit='';
rlm@46 717 }
rlm@46 718
rlm@46 719 function info_text()
rlm@46 720 {
rlm@46 721 $('options_text').style.visibility = 'visible';
rlm@46 722 }
rlm@46 723 function info_shape()
rlm@46 724 {
rlm@46 725 $('options_select_path').style.visibility = 'visible';
rlm@46 726 $('linksPaths').style.visibility = 'visible';
rlm@46 727 $('panel_shapes').style.visibility= 'visible';
rlm@46 728 }
rlm@46 729 function info_rect()
rlm@46 730 {
rlm@46 731 $('options_rect').style.visibility = 'visible';
rlm@46 732 }
rlm@46 733 function info_ellipse()
rlm@46 734 {
rlm@46 735 $('options_ellipse').style.visibility = 'visible';
rlm@46 736 }
rlm@46 737
rlm@46 738 function info_image()
rlm@46 739 {
rlm@46 740 $('options_image').style.visibility = 'visible';
rlm@46 741 }
rlm@46 742 function info_path()
rlm@46 743 {
rlm@46 744 $('options_path').style.visibility = 'visible';
rlm@46 745
rlm@46 746 }
rlm@46 747 function info_controlpath()
rlm@46 748 {
rlm@46 749 $('options_path').style.visibility = 'visible';
rlm@46 750
rlm@46 751 }
rlm@46 752 function info_zoom()
rlm@46 753 {
rlm@46 754 $('options_zoom').style.visibility = 'visible';
rlm@46 755 //$('options_zoom').style.backgroundColor = colorpage;
rlm@46 756 if(zoommode=='hand')
rlm@46 757 {
rlm@46 758 document.getElementById('richdraw').style.cursor='move';
rlm@46 759
rlm@46 760 }else{
rlm@46 761 if(zoommode=='window')
rlm@46 762 {
rlm@46 763
rlm@46 764 }else{
rlm@46 765 c.renderer.zoom(0,0);
rlm@46 766 }
rlm@46 767 }
rlm@46 768 var imgs = $('options_zoom').getElementsByTagName('img');
rlm@46 769 for (var i=0; i<imgs.length; i++)
rlm@46 770 {
rlm@46 771 imgs[i].style.backgroundColor = '';
rlm@46 772 }
rlm@46 773 $('zoom_'+zoommode).style.backgroundColor = 'orange';
rlm@46 774
rlm@46 775
rlm@46 776
rlm@46 777 }
rlm@46 778
rlm@46 779 function info_pathsEdit(){
rlm@46 780 $('options_path').style.visibility = 'visible';
rlm@46 781 }
rlm@46 782
rlm@46 783 function info_select()
rlm@46 784 {
rlm@46 785 $('options_select').style.visibility = 'visible';
rlm@46 786 //$('options_select').style.backgroundColor = colorpage;
rlm@46 787
rlm@46 788 if(selectedit=='deleteone')
rlm@46 789 {
rlm@46 790 deleteShape();
rlm@46 791 }
rlm@46 792 if(selectedit=='deleteall')
rlm@46 793 {
rlm@46 794 deleteAllShapes();
rlm@46 795 }
rlm@46 796 if(selectedit=='tothetop')
rlm@46 797 {
rlm@46 798 toFront(-1);
rlm@46 799 }
rlm@46 800 if(selectedit=='totheback')
rlm@46 801 {
rlm@46 802 toFront(0);
rlm@46 803 }
rlm@46 804 if(selectedit=='oneback')
rlm@46 805 {
rlm@46 806 toFront(1);
rlm@46 807 }
rlm@46 808 if(selectedit=='onetop')
rlm@46 809 {
rlm@46 810 toFront(2);
rlm@46 811 }
rlm@46 812 if(selectedit=='reflectV')
rlm@46 813 {
rlm@46 814 c.reflect('V');
rlm@46 815 }
rlm@46 816 if(selectedit=='reflectH')
rlm@46 817 {
rlm@46 818 c.reflect('H');
rlm@46 819 }
rlm@46 820
rlm@46 821 var imgs = $('options_select').getElementsByTagName('img');
rlm@46 822 for (var i=0; i<imgs.length; i++)
rlm@46 823 {
rlm@46 824 imgs[i].style.backgroundColor = '';
rlm@46 825 }
rlm@46 826 if(selectedit != '')
rlm@46 827 {
rlm@46 828 $('select_'+selectedit).style.backgroundColor = 'orange';
rlm@46 829 }
rlm@46 830
rlm@46 831 }
rlm@46 832
rlm@46 833
rlm@46 834 ////////////////////////////
rlm@46 835
rlm@46 836
rlm@46 837 function setShape()
rlm@46 838 {
rlm@46 839 if(selectmode=='select' || selectmode=='control_path' || selectmode=='path'){
rlm@46 840 c.submitShape(document.forms[0].control_codebase.value);
rlm@46 841 }else{
rlm@46 842 setMode('path', 'Path');
rlm@46 843 c.submitShape(document.forms[0].codebase.value);
rlm@46 844 }
rlm@46 845 }
rlm@46 846
rlm@46 847 //function onKeyPress(){
rlm@46 848 //c.onKeyPress();
rlm@46 849 //}
rlm@46 850
rlm@46 851
rlm@46 852 function deleteShape()
rlm@46 853 {
rlm@46 854 c.deleteSelection();
rlm@46 855 }
rlm@46 856
rlm@46 857 function deleteAllShapes()
rlm@46 858 {
rlm@46 859 c.deleteAll();
rlm@46 860 }
rlm@46 861
rlm@46 862 function deleteLastShapes()
rlm@46 863 {
rlm@46 864 //c.deleteLast();
rlm@46 865 c.clipboard=c.renderer.undo();
rlm@46 866 }
rlm@46 867 function toFront(num)
rlm@46 868 {
rlm@46 869 c.toFront(num);
rlm@46 870 }
rlm@46 871 function cutSelected()
rlm@46 872 {
rlm@46 873
rlm@46 874 c.clipboard=c.renderer.copy(c.selected);
rlm@46 875 c.deleteSelection();
rlm@46 876 }
rlm@46 877 function copySelected()
rlm@46 878 {
rlm@46 879 c.clipboard=c.renderer.copy(c.selected);
rlm@46 880 }
rlm@46 881 function pasteSelected()
rlm@46 882 {
rlm@46 883 c.selected=c.renderer.paste(c.clipboard,c.mouseDownX,c.mouseDownY);
rlm@46 884 c.selected.id = 'shape:' + createUUID();
rlm@46 885 Ext.get(c.selected).on( "mousedown", c.onHit,c);
rlm@46 886 }
rlm@46 887 function duplicateSelected()
rlm@46 888 {
rlm@46 889 c.selected=c.renderer.duplicate(c.selected);
rlm@46 890 c.selected.id = 'shape:' + createUUID();
rlm@46 891 Ext.get(c.selected).on( "mousedown", c.onHit,c);
rlm@46 892 }
rlm@46 893 ///////////////////////////
rlm@46 894
rlm@46 895
rlm@46 896 function setFillColor(color) //colors --
rlm@46 897 {
rlm@46 898 //-- var color = colors.options[colors.selectedIndex].value;
rlm@46 899 //-- colors.style.backgroundColor = color;
rlm@46 900
rlm@46 901 c.editCommand('fillcolor', color);
rlm@46 902 }
rlm@46 903
rlm@46 904 function setLineColor(color) //colors --
rlm@46 905 {
rlm@46 906 //--var color = colors.options[colors.selectedIndex].value;
rlm@46 907 //-- colors.style.backgroundColor = color;
rlm@46 908
rlm@46 909 c.editCommand('linecolor', color);
rlm@46 910 }
rlm@46 911
rlm@46 912 function setLineWidth(width) //width --
rlm@46 913 {
rlm@46 914 //-- var width = widths.options[widths.selectedIndex].value;
rlm@46 915 c.editCommand('linewidth', width);
rlm@46 916 }
rlm@46 917 ////
rlm@46 918 //++
rlm@46 919 function setFillOpacity(opacity)
rlm@46 920 {
rlm@46 921 c.editCommand('fillopacity', opacity);
rlm@46 922 }
rlm@46 923 ////
rlm@46 924 //++
rlm@46 925 function setLineOpacity(opacity)
rlm@46 926 {
rlm@46 927 c.editCommand('lineopacity', opacity);
rlm@46 928 }
rlm@46 929
rlm@46 930 function setTextFamily(types)
rlm@46 931 {
rlm@46 932 var type = types.options[types.selectedIndex].value;
rlm@46 933 document.forms[0].option_text_family.value=type; //bad :-(
rlm@46 934 data_text_family = type;
rlm@46 935 c.submitShape($('option_text_message').value+'<;>'+$('option_text_size').value+'<;>'+$('option_text_family').value);
rlm@46 936 }
rlm@46 937
rlm@46 938 function setGridWidth(widths)
rlm@46 939 {
rlm@46 940 var width = eval(widths.options[widths.selectedIndex].value);
rlm@46 941 RichDrawEditor.prototype.setGrid(width, width);
rlm@46 942 }
rlm@46 943
rlm@46 944 ///////////////////////////////
rlm@46 945
rlm@46 946
rlm@46 947 function getOptionByValue(select, value)
rlm@46 948 {
rlm@46 949 /*for (var i=0; i<select.length; i++)
rlm@46 950 {
rlm@46 951 if (select.options[i].value == value)
rlm@46 952 {
rlm@46 953 return i;
rlm@46 954 }
rlm@46 955 }
rlm@46 956 return -1;
rlm@46 957 */
rlm@46 958 }
rlm@46 959
rlm@46 960 /////////////////////////////
rlm@46 961
rlm@46 962 function showMarkupCode()
rlm@46 963 {
rlm@46 964 $('code').value = c.renderer.getMarkup();
rlm@46 965 //document.forms[0].code.focus();
rlm@46 966 //$('code').select;
rlm@46 967 showinfoFrame('SVG code')
rlm@46 968 //infoFrame.setTitle('SVG code');
rlm@46 969 //infoFrame.show();
rlm@46 970
rlm@46 971 }
rlm@46 972 function openFile()
rlm@46 973 {
rlm@46 974 $('file').value = initialFile;
rlm@46 975 //document.forms[0].code.focus();
rlm@46 976 //$('code').select;
rlm@46 977 showopenFile('Open File')
rlm@46 978 //infoFrame.setTitle('SVG code');
rlm@46 979 //infoFrame.show();
rlm@46 980
rlm@46 981 }
rlm@46 982 function showMarkup()
rlm@46 983 {
rlm@46 984 document.forms[0].code.value=Ext.util.JSON.encode(canvas(c));
rlm@46 985 //infoFrame.setTitle('OPF code');
rlm@46 986 //infoFrame.show();
rlm@46 987 showinfoFrame('OPF code')
rlm@46 988
rlm@46 989
rlm@46 990 }
rlm@46 991
rlm@46 992 function shm()
rlm@46 993 {
rlm@46 994 var json = Ext.util.JSON.encode(canvas(c))
rlm@46 995 $('someinfo').value = "JSON File Format Saved : "+( c.renderer.getMarkup().length - json.length )+" characters; JSON Character Total: "+json.length
rlm@46 996 $('code').value=json;
rlm@46 997 }
rlm@46 998
rlm@46 999 function lcm()
rlm@46 1000 {
rlm@46 1001 load(Ext.util.JSON.decode(document.forms[0].code.value),c)
rlm@46 1002
rlm@46 1003 }
rlm@46 1004
rlm@46 1005 ////////////////////////////////////////
rlm@46 1006
rlm@46 1007
rlm@46 1008 function onSelect()
rlm@46 1009 {
rlm@46 1010 /*$('fillcolor').selectedIndex = getOptionByValue($('fillcolor'), c.queryCommand('fillcolor'));
rlm@46 1011 $('fillcolor').style.backgroundColor = c.queryCommand('fillcolor');
rlm@46 1012 $('linecolor').selectedIndex = getOptionByValue($('linecolor'), c.queryCommand('linecolor'));
rlm@46 1013 $('linecolor').style.backgroundColor = c.queryCommand('linecolor');
rlm@46 1014 $('linewidth').selectedIndex = getOptionByValue($('linewidth'), c.queryCommand('linewidth'));
rlm@46 1015 */
rlm@46 1016 hiddenAllMenus();
rlm@46 1017 info_select();
rlm@46 1018
rlm@46 1019 if (c.selected.tagName == 'rect'){
rlm@46 1020 //setMode('rect', 'Rectangle')
rlm@46 1021 info_rect();
rlm@46 1022 }
rlm@46 1023 if (c.selected.tagName == 'image'){
rlm@46 1024 info_image();
rlm@46 1025 }
rlm@46 1026 if (c.selected.tagName == 'text'){
rlm@46 1027 info_text();
rlm@46 1028 }
rlm@46 1029 if (c.selected.tagName == 'line'){
rlm@46 1030 //info_line();
rlm@46 1031 }
rlm@46 1032 if (c.selected.tagName == 'ellipse'){
rlm@46 1033 info_ellipse()
rlm@46 1034 }
rlm@46 1035 if (c.selected.tagName == 'path') {
rlm@46 1036
rlm@46 1037 info_path();
rlm@46 1038 }
rlm@46 1039 if (c.selected.tagName == 'shape'){
rlm@46 1040 var detail=c.selected.children[0].tagName;
rlm@46 1041 $('someinfo').value=detail;
rlm@46 1042 if(detail=='path'){ info_path(); }
rlm@46 1043 if(detail=='textpath'){ info_text(); }
rlm@46 1044 }
rlm@46 1045 if (c.selected.tagName == 'oval') {
rlm@46 1046
rlm@46 1047 info_ellipse();
rlm@46 1048 }
rlm@46 1049
rlm@46 1050 //frames['mondrianstyle'].setcolorhex(c.queryCommand('linecolor'),'stroke');
rlm@46 1051 //frames['mondrianstyle'].setcolorhex(c.queryCommand('fillcolor'),'fill');
rlm@46 1052 }
rlm@46 1053
rlm@46 1054 function onUnselect()
rlm@46 1055 {
rlm@46 1056
rlm@46 1057 /*
rlm@46 1058 $('fillcolor').selectedIndex = getOptionByValue($('fillcolor'), c.queryCommand('fillcolor'));
rlm@46 1059 $('fillcolor').style.backgroundColor = c.queryCommand('fillcolor');
rlm@46 1060 $('linecolor').selectedIndex = getOptionByValue($('linecolor'), c.queryCommand('linecolor'));
rlm@46 1061 $('linecolor').style.backgroundColor = c.queryCommand('linecolor');
rlm@46 1062 $('linewidth').selectedIndex = getOptionByValue($('linewidth'), c.queryCommand('linewidth'));
rlm@46 1063 */
rlm@46 1064
rlm@46 1065 }
rlm@46 1066
rlm@46 1067 function editPath(myfield,e)
rlm@46 1068 {
rlm@46 1069
rlm@46 1070 var keycode;
rlm@46 1071
rlm@46 1072
rlm@46 1073 // ++? if (window.event) keycode = window.event.e;
rlm@46 1074
rlm@46 1075 e= (e) ? e : ((window.event) ? event : null);
rlm@46 1076 keycode=e.keyCode;
rlm@46 1077 var shs= myfield.id.split('_');
rlm@46 1078 var sh=shs[1];
rlm@46 1079
rlm@46 1080 var mypath=$('control_codebase').value;
rlm@46 1081
rlm@46 1082
rlm@46 1083 var x= $('option_path_x').value;
rlm@46 1084 var y= $('option_path_y').value;
rlm@46 1085 var precoord=x+','+y;
rlm@46 1086
rlm@46 1087
rlm@46 1088 var mypointNum=$('option_path_num').value;
rlm@46 1089 var controlNodeNum=2;
rlm@46 1090
rlm@46 1091 if (keycode == 38)//#26
rlm@46 1092 {
rlm@46 1093 myfield.value=eval(myfield.value)+1;
rlm@46 1094 }
rlm@46 1095 if (keycode == 40)// #28
rlm@46 1096 {
rlm@46 1097 myfield.value=eval(myfield.value)-1;
rlm@46 1098 }
rlm@46 1099 if (keycode == 13 || keycode == 40 || keycode == 38)
rlm@46 1100 {
rlm@46 1101 var cadx= $('option_path_x').value;
rlm@46 1102 var cady= $('option_path_y').value;
rlm@46 1103 var coord=cadx+','+cady;
rlm@46 1104
rlm@46 1105 //$('code').value=coord;
rlm@46 1106
rlm@46 1107 var cad1=new RegExp(precoord,"g");
rlm@46 1108
rlm@46 1109
rlm@46 1110 var result=mypath.replace(cad1, coord);
rlm@46 1111
rlm@46 1112 $('control_codebase').value=' ';
rlm@46 1113 $('control_codebase').value=result;
rlm@46 1114
rlm@46 1115 $('someinfo').value=precoord;
rlm@46 1116 //alert(myfield.id);
rlm@46 1117 setShape(); //c.renderer.tocurve();
rlm@46 1118
rlm@46 1119 return false;
rlm@46 1120
rlm@46 1121 }
rlm@46 1122 else
rlm@46 1123 return true;
rlm@46 1124 }
rlm@46 1125
rlm@46 1126
rlm@46 1127 function editPathXX(myfield,e)
rlm@46 1128 {
rlm@46 1129
rlm@46 1130 var keycode;
rlm@46 1131
rlm@46 1132
rlm@46 1133 // ++? if (window.event) keycode = window.event.e;
rlm@46 1134
rlm@46 1135 e= (e) ? e : ((window.event) ? event : null);
rlm@46 1136 keycode=e.keyCode;
rlm@46 1137 var shs= myfield.id.split('_');
rlm@46 1138 var sh=shs[1];
rlm@46 1139
rlm@46 1140 var mypath=$('control_codebase').value;
rlm@46 1141 var mypointNum=$('option_path_num').value;
rlm@46 1142 var controlNodeNum=2;
rlm@46 1143
rlm@46 1144 if (keycode == 38)//#26
rlm@46 1145 {
rlm@46 1146 myfield.value=eval(myfield.value)+1;
rlm@46 1147 }
rlm@46 1148 if (keycode == 40)// #28
rlm@46 1149 {
rlm@46 1150 myfield.value=eval(myfield.value)-1;
rlm@46 1151 }
rlm@46 1152
rlm@46 1153
rlm@46 1154 var points=mypath.split('C');
rlm@46 1155 var chain='';
rlm@46 1156 var segment=' ';
rlm@46 1157 prevControl=' ';
rlm@46 1158 nextControl=' ';
rlm@46 1159 nodePoint=' ';
rlm@46 1160 var init=points[0].split('M');
rlm@46 1161 var allcoords=init[1].split(' ');
rlm@46 1162 var point=allcoords[0].split(',');
rlm@46 1163
rlm@46 1164 if(mypointNum==0){
rlm@46 1165
rlm@46 1166 point[1]= $('option_path_x').value;
rlm@46 1167 point[2]= $('option_path_y').value;
rlm@46 1168 var change=point.join(',')
rlm@46 1169
rlm@46 1170 chain+='M' + change+' ';
rlm@46 1171 }else{
rlm@46 1172 chain+='M'+points[0]+' ';
rlm@46 1173 }
rlm@46 1174
rlm@46 1175 var numpoints=points.length-1;
rlm@46 1176 if(numpoints>1){
rlm@46 1177 for(var a=1;a<=numpoints;a++)
rlm@46 1178 {
rlm@46 1179
rlm@46 1180 if(a==mypointNum){
rlm@46 1181
rlm@46 1182 segment=points[a].split(' ');
rlm@46 1183 prevControl=segment[0]+' ';
rlm@46 1184 nextControl=segment[1]+' ';
rlm@46 1185 nodePoint=segment[2]+' ';
rlm@46 1186
rlm@46 1187
rlm@46 1188 /*if(controlNodeNum==0){chain+=prevControl; var point=prevControl.split(',');}
rlm@46 1189 if(controlNodeNum==1){chain+=nextControl; var point=nextControl.split(',');}
rlm@46 1190 if(controlNodeNum==2){chain+=nodePoint; var point=nodePoint.split(',');}
rlm@46 1191 */
rlm@46 1192
rlm@46 1193 var point=nodePoint.split(',');
rlm@46 1194 point[1]= $('option_path_x').value;
rlm@46 1195 point[2]= $('option_path_y').value;
rlm@46 1196 var change=point.join(',')
rlm@46 1197
rlm@46 1198 chain+='C'+prevControl+ nextControl + change+' ';
rlm@46 1199 }else{
rlm@46 1200 chain+='C'+points[a];
rlm@46 1201 }
rlm@46 1202
rlm@46 1203 }
rlm@46 1204
rlm@46 1205 }else{
rlm@46 1206 chain+='C'+points[1];
rlm@46 1207
rlm@46 1208 }
rlm@46 1209 //$('someinfo').value= chain;
rlm@46 1210 $('control_codebase').value=chain;
rlm@46 1211
rlm@46 1212
rlm@46 1213
rlm@46 1214
rlm@46 1215
rlm@46 1216 if (keycode == 13 || keycode == 40 || keycode == 38)
rlm@46 1217 {
rlm@46 1218 //alert(myfield.id);
rlm@46 1219 c.renderer.tocurve();
rlm@46 1220
rlm@46 1221 return false;
rlm@46 1222
rlm@46 1223 }
rlm@46 1224 else
rlm@46 1225 return true;
rlm@46 1226 }
rlm@46 1227
rlm@46 1228
rlm@46 1229
rlm@46 1230 function edit(myfield,e)
rlm@46 1231 {
rlm@46 1232
rlm@46 1233 var keycode;
rlm@46 1234
rlm@46 1235
rlm@46 1236 // ++? if (window.event) keycode = window.event.e;
rlm@46 1237 //else if (e) keycode = e.which;
rlm@46 1238
rlm@46 1239 e= (e) ? e : ((window.event) ? event : null);
rlm@46 1240 keycode=e.keyCode;
rlm@46 1241 //var keycode = e.which?e.which:e.keycode
rlm@46 1242
rlm@46 1243 //document.layers ? e.which :
rlm@46 1244 //document.all ? e.keyCode :
rlm@46 1245 //document.getElementById ? e.keyCode : 0;
rlm@46 1246 //else return true;
rlm@46 1247 var keyChar = String.fromCharCode(keycode);
rlm@46 1248 //var numCheck = /\d/;
rlm@46 1249 //if (((keyChar=='.')&&(obj.value.indexOf('.')==-1))¦¦(keycode<32)¦¦numCheck.test(keyChar)¦¦((keycode>=37)&&(keycode<=40)&&(!e.modifiers&&!e.shiftKey))) {
rlm@46 1250
rlm@46 1251 //alert(keycode+' _ '+keyChar);
rlm@46 1252 var shs= myfield.id.split('_');
rlm@46 1253 var sh=shs[1];
rlm@46 1254 if(myfield.id.indexOf('control_codebase')<=0)
rlm@46 1255 {
rlm@46 1256 if (keycode == 38)//#26
rlm@46 1257 {
rlm@46 1258
rlm@46 1259 if(eval(myfield.value)>0)
rlm@46 1260 {
rlm@46 1261 myfield.value=eval(myfield.value)+1;
rlm@46 1262 //alert(myfield.value);
rlm@46 1263 }
rlm@46 1264 //return false;
rlm@46 1265 //alert('keycode')
rlm@46 1266
rlm@46 1267 }
rlm@46 1268 if (keycode == 40)// #28
rlm@46 1269 {
rlm@46 1270 myfield.value=eval(myfield.value)-1;
rlm@46 1271 if(myfield.id=='option_path_sclx' || myfield.id=='option_path_scly')
rlm@46 1272 {
rlm@46 1273 if( eval(myfield.value)<=0 )
rlm@46 1274 {
rlm@46 1275 myfield.value=1;
rlm@46 1276 }
rlm@46 1277 }
rlm@46 1278
rlm@46 1279 if(myfield.id=='option_text_size')
rlm@46 1280 {
rlm@46 1281 if( eval(myfield.value)<=0 )
rlm@46 1282 {
rlm@46 1283 myfield.value=1;
rlm@46 1284 }
rlm@46 1285 }
rlm@46 1286 }
rlm@46 1287
rlm@46 1288 }
rlm@46 1289
rlm@46 1290 if (keycode == 13 || keycode == 40 || keycode == 38)
rlm@46 1291 {
rlm@46 1292 var check=0;
rlm@46 1293 if(myfield.id=='control_codebase')
rlm@46 1294 {
rlm@46 1295 //alert(myfield.id)
rlm@46 1296 //c.submitShape($('control_codebase').value+'');
rlm@46 1297 check=1;
rlm@46 1298 setShape();
rlm@46 1299 }
rlm@46 1300
rlm@46 1301 if(myfield.id.indexOf('href')>0)
rlm@46 1302 {
rlm@46 1303 c.submitShape(myfield.value)
rlm@46 1304 }
rlm@46 1305
rlm@46 1306 if(myfield.id.indexOf('tr')>0 || myfield.id.indexOf('scl')>0)
rlm@46 1307 {
rlm@46 1308 if(check==0)
rlm@46 1309 {
rlm@46 1310 c.submitShape($('option_'+sh+'_trx').value+';'+$('option_'+sh+'_try').value+';'+$('option_'+sh+'_sclx').value+';'+$('option_'+sh+'_scly').value+';'+$('option_'+sh+'_rot').value)
rlm@46 1311 }
rlm@46 1312 }
rlm@46 1313
rlm@46 1314 if(myfield.id.indexOf('rot')>0)
rlm@46 1315 {
rlm@46 1316 c.submitShape($('option_'+sh+'_trx').value+';'+$('option_'+sh+'_try').value+';'+$('option_'+sh+'_sclx').value+';'+$('option_'+sh+'_scly').value+';'+$('option_'+sh+'_rot').value)
rlm@46 1317 }
rlm@46 1318
rlm@46 1319 if(myfield.id.indexOf('text')>0)
rlm@46 1320 {
rlm@46 1321 c.submitShape($('option_text_message').value+'<;>'+$('option_text_size').value+'<;>'+$('option_text_family').value);
rlm@46 1322 }
rlm@46 1323 //alert(myfield.id);
rlm@46 1324 return false;
rlm@46 1325
rlm@46 1326 }
rlm@46 1327 else
rlm@46 1328 return true;
rlm@46 1329 }
rlm@46 1330
rlm@46 1331
rlm@46 1332
rlm@46 1333
rlm@46 1334 function env(myfield,delta)
rlm@46 1335 {
rlm@46 1336
rlm@46 1337 //alert(keycode+' _ '+keyChar);
rlm@46 1338
rlm@46 1339 if (delta >0)//#26
rlm@46 1340 {
rlm@46 1341 myfield.value=eval(myfield.value)+1;
rlm@46 1342 //return false;
rlm@46 1343 //alert('keycode')
rlm@46 1344 }
rlm@46 1345 else
rlm@46 1346 {
rlm@46 1347 myfield.value=eval(myfield.value)-1;
rlm@46 1348 //return false;
rlm@46 1349 }
rlm@46 1350
rlm@46 1351
rlm@46 1352 if(myfield.id=='option_image_href')
rlm@46 1353 {
rlm@46 1354 c.submitShape(myfield.value)
rlm@46 1355 }
rlm@46 1356 if(myfield.id=='option_select_trx' || myfield.id=='option_select_try' || myfield.id=='option_select_sclx' || myfield.id=='option_select_scly')
rlm@46 1357 {
rlm@46 1358 c.submitShape($('option_select_trx').value+';'+$('option_select_try').value+';'+$('option_select_sclx').value+';'+$('option_select_scly').value+';'+$('option_select_rot').value)
rlm@46 1359 }
rlm@46 1360 if(myfield.id=='option_select_rot')
rlm@46 1361 {
rlm@46 1362 c.submitShape($('option_select_trx').value+';'+$('option_select_try').value+';'+$('option_select_sclx').value+';'+$('option_select_scly').value+';'+$('option_select_rot').value)
rlm@46 1363 }
rlm@46 1364
rlm@46 1365 }
rlm@46 1366
rlm@46 1367
rlm@46 1368 function clockdata(){
rlm@46 1369 //////////////
rlm@46 1370 //++
rlm@46 1371
rlm@46 1372 data_path_close = $('option_path_close').checked;
rlm@46 1373 data_text_family = $('option_text_family').value;
rlm@46 1374 data_text_size = parseFloat($('option_text_size').value);
rlm@46 1375 data_text_messaje = $('option_text_message').value;
rlm@46 1376 data_image_href = $('option_image_href').value;
rlm@46 1377
rlm@46 1378 ////////////
rlm@46 1379 }
rlm@46 1380
rlm@46 1381 function myWorkSize() {
rlm@46 1382 var myWidth = 0, myHeight = 0;
rlm@46 1383 if( typeof( window.innerWidth ) == 'number' ) {
rlm@46 1384 //Non-IE
rlm@46 1385 myWidth = window.innerWidth;
rlm@46 1386 myHeight = window.innerHeight;
rlm@46 1387 } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
rlm@46 1388 //IE 6+ in 'standards compliant mode'
rlm@46 1389 myWidth = document.documentElement.clientWidth;
rlm@46 1390 myHeight = document.documentElement.clientHeight;
rlm@46 1391 } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
rlm@46 1392 //IE 4 compatible
rlm@46 1393 myWidth = document.body.clientWidth;
rlm@46 1394 myHeight = document.body.clientHeight;
rlm@46 1395 }
rlm@46 1396 return [ myWidth, myHeight] ;
rlm@46 1397 }
rlm@46 1398
rlm@46 1399 function doResize(){
rlm@46 1400 //deleteAllShapes();
rlm@46 1401 vertexFrames();
rlm@46 1402 resizeFrame();
rlm@46 1403 //c.renderer.zoomFrame(zoominit);
rlm@46 1404 //c.renderer.view(canvasX,canvasY,canvasW,canvasH,zoominit)
rlm@46 1405 //c.renderer.view(docx,docy,docw,doch,zoominit1)
rlm@46 1406 // delete rectCanvas
rlm@46 1407 // var vB=zoomx+' '+zoomy+' '+zoomw+' '+zoomh;
rlm@46 1408
rlm@46 1409 //c.renderer.rectCanvas(docx,docy,docw,doch,vB);
rlm@46 1410 }
rlm@46 1411
rlm@46 1412 function vertexFrames(){
rlm@46 1413
rlm@46 1414 var screenSize=myWorkSize();
rlm@46 1415 scrW = screenSize[0];//screen.availWidth;
rlm@46 1416 scrH = screenSize[1];//screen.availHeight;
rlm@46 1417
rlm@46 1418 wndW=scrW;//window.width;
rlm@46 1419 wndH=scrH;//window.height;
rlm@46 1420
rlm@46 1421
rlm@46 1422 if (scrW != wndW || scrH != wndH) {
rlm@46 1423 //window.resizeTo(scrW, scrH);
rlm@46 1424 //window.moveTo(0, 0);
rlm@46 1425 }
rlm@46 1426 //var wProportion={x:35, y:24}
rlm@46 1427
rlm@46 1428 vertexNORTHmenu={ NORTHmenu1:[0,0],NORTHmenu2:[scrW,0],NORTHmenu3:[0,wProportion.y],NORTHmenu4:[scrW,wProportion.y] };
rlm@46 1429 vertexNORTHglobals={ NORTHglobals1:[0,wProportion.y],NORTHglobals2:[scrW,wProportion.y],NORTHglobals3:[0,wProportion.y*2],NORTHglobals4:[scrW,wProportion.y*2] };
rlm@46 1430 vertexNORTHoptions={ NORTHoptions1:[0,wProportion.y*2],NORTHoptions2:[scrW,wProportion.y*2],NORTHoptions3:[0,wProportion.y*3],NORTHoptions4:[scrW,wProportion.y*3] };
rlm@46 1431 vertexSUD={ SUD1:[0,wndH-wProportion.y*3], SUD2:[scrW,(wndH-wProportion.y*3)], SUD3:[0,wndH], SUD4:[scrW,wndH]};
rlm@46 1432 vertexEST={ EST1:[0,wProportion.y*3], EST2:[wProportion.x,wProportion.y*3], EST3:[0,(wndH-wProportion.y*3)], EST4:[wProportion.x,(wndH-wProportion.y*3)] };
rlm@46 1433 vertexWEST={ WEST1:[(scrW-wProportion.x*3),wProportion.y*3], WEST2:[scrW,wProportion.y*3], WEST3:[(scrW-wProportion.x*3),(wndH-wProportion.y*3)], WEST4:[scrW,(wndH-wProportion.y*3)] };
rlm@46 1434 vertexFRONT={ FRONT1:[vertexEST.EST2[0],vertexEST.EST2[1]], FRONT2:[vertexWEST.WEST1[0],vertexWEST.WEST1[1]], FRONT3:[vertexEST.EST4[0],vertexEST.EST4[1]], FRONT4:[vertexWEST.WEST3[0],vertexWEST.WEST3[1]] };
rlm@46 1435
rlm@46 1436 NORTHmenusize=[vertexNORTHmenu.NORTHmenu4[0]-vertexNORTHmenu.NORTHmenu1[0],vertexNORTHmenu.NORTHmenu4[1]-vertexNORTHmenu.NORTHmenu1[1]];
rlm@46 1437 NORTHglobalssize=[vertexNORTHglobals.NORTHglobals4[0]-vertexNORTHglobals.NORTHglobals1[0],vertexNORTHglobals.NORTHglobals4[1]-vertexNORTHglobals.NORTHglobals1[1]];
rlm@46 1438 NORTHoptionssize=[vertexNORTHoptions.NORTHoptions4[0]-vertexNORTHoptions.NORTHoptions1[0],vertexNORTHoptions.NORTHoptions4[1]-vertexNORTHoptions.NORTHoptions1[1]];
rlm@46 1439 SUDsize=[vertexSUD.SUD4[0]-vertexSUD.SUD1[0],vertexSUD.SUD4[1]-vertexSUD.SUD1[1]];
rlm@46 1440 ESTsize=[vertexEST.EST4[0]-vertexEST.EST1[0],vertexEST.EST4[1]-vertexEST.EST1[1]];
rlm@46 1441 WESTsize=[vertexWEST.WEST4[0]-vertexWEST.WEST1[0],vertexWEST.WEST4[1]-vertexWEST.WEST1[1]];
rlm@46 1442 FRONTsize=[vertexFRONT.FRONT4[0]-vertexFRONT.FRONT1[0],vertexFRONT.FRONT4[1]-vertexFRONT.FRONT1[1]];
rlm@46 1443
rlm@46 1444
rlm@46 1445
rlm@46 1446 //percent of FRONTsize
rlm@46 1447 proporDoc= FRONTsize[0]/FRONTsize[1];
rlm@46 1448 canvasYpercent=100;
rlm@46 1449 canvasXpercent=100;
rlm@46 1450 canvasWidth=Math.round(FRONTsize[0]*canvasXpercent/100);//FRONTsize[0];
rlm@46 1451 canvasW=canvasWidth;
rlm@46 1452 canvasHeight=Math.round(canvasYpercent*FRONTsize[1]/100);//FRONTsize[1];
rlm@46 1453 canvasH=canvasHeight;
rlm@46 1454 canvasX=Math.round((FRONTsize[0]-canvasW)/2);
rlm@46 1455 canvasY=Math.round((FRONTsize[1]-canvasH)/2);
rlm@46 1456
rlm@46 1457
rlm@46 1458 //vertexFRONTcanvas={ FRONT1:[vertexEST.EST2[0],vertexEST.EST2[1]], FRONT2:[vertexWEST.WEST1[0],vertexWEST.WEST1[1]], FRONT3:[vertexEST.EST4[0],vertexEST.EST4[1]], FRONT4:[vertexWEST.WEST3[0],vertexWEST.WEST3[1]] };
rlm@46 1459 //FRONTcanvassize=[vertexFRONT.FRONT4[0]-vertexFRONT.FRONT1[0],vertexFRONT.FRONT4[1]-vertexFRONT.FRONT1[1]];
rlm@46 1460
rlm@46 1461
rlm@46 1462 //centerZoomx=Math.round(canvasWidth/2);
rlm@46 1463 //centerZoomy=Math.round(canvasHeight/2);
rlm@46 1464 if(canvasH==0){ canvasH=0.00000001; }
rlm@46 1465 proporCanvas= canvasW/canvasH ;
rlm@46 1466 //zoominit='0 0 '+zoomw+' '+zoomh;//
rlm@46 1467
rlm@46 1468 makeWorkSite(canvasH,(-canvasW/2)+(docw/2),(-canvasH/2)+(doch/2));
rlm@46 1469 diagonalinit=diagonalFrame;
rlm@46 1470 proporDiagonal=diagonalFrame/diagonalinit;
rlm@46 1471 zoominit=(zoomx)+' '+(zoomy)+' '+zoomw+' '+zoomh;
rlm@46 1472 //$('someinfo').value= zoominit;
rlm@46 1473 //document.forms[0].someinfo.value= zoominit;
rlm@46 1474 //document.getElementById("someinfo").value = zoominit
rlm@46 1475 //Ext.get('richdraw').dom.style.scrollTop = ('40%');
rlm@46 1476 //alert(zoominit);
rlm@46 1477 }
rlm@46 1478
rlm@46 1479 function resizeFrame(){
rlm@46 1480
rlm@46 1481 Ext.get('NORTHmenu').dom.style.backgroundColor = (colorpage1a);
rlm@46 1482 Ext.get('NORTHglobals').dom.style.backgroundColor = (colorpage1b);
rlm@46 1483 Ext.get('NORTHoptions').dom.style.backgroundColor = (colorpage1c);
rlm@46 1484
rlm@46 1485 Ext.get('SUD').dom.style.backgroundColor = (colorpage2);
rlm@46 1486 Ext.get('EST').dom.style.backgroundColor = (colorpage3);
rlm@46 1487 Ext.get('WEST').dom.style.backgroundColor = (colorpage4);
rlm@46 1488
rlm@46 1489 Ext.get('linksPaths').dom.style.backgroundColor = (colorpage); // bad
rlm@46 1490
rlm@46 1491
rlm@46 1492 Ext.get('NORTHmenu').dom.style.left =(vertexNORTHmenu.NORTHmenu1[0]+'px'); Ext.get('NORTHmenu').dom.style.top =(vertexNORTHmenu.NORTHmenu1[1]+'px');Ext.get('NORTHmenu').dom.style.width =(NORTHmenusize[0]+'px'); Ext.get('NORTHmenu').dom.style.height = (NORTHmenusize[1]+'px');
rlm@46 1493 Ext.get('NORTHglobals').dom.style.left =(vertexNORTHglobals.NORTHglobals1[0]+'px'); Ext.get('NORTHglobals').dom.style.top =(vertexNORTHglobals.NORTHglobals1[1]+'px');Ext.get('NORTHglobals').dom.style.width =(NORTHglobalssize[0]+'px'); Ext.get('NORTHglobals').dom.style.height =(NORTHglobalssize[1]+'px');
rlm@46 1494 Ext.get('NORTHoptions').dom.style.left =(vertexNORTHoptions.NORTHoptions1[0]+'px'); Ext.get('NORTHoptions').dom.style.top =(vertexNORTHoptions.NORTHoptions1[1]+'px');Ext.get('NORTHoptions').dom.style.width =(NORTHoptionssize[0]+'px'); Ext.get('NORTHoptions').dom.style.height =(NORTHoptionssize[1]+'px');
rlm@46 1495 Ext.get('SUD').dom.style.left =(vertexSUD.SUD1[0]+'px'); Ext.get('SUD').dom.style.top =(vertexSUD.SUD1[1]+'px');Ext.get('SUD').dom.style.width=(SUDsize[0]+'px'); Ext.get('SUD').dom.style.height =(SUDsize[1]+'px');
rlm@46 1496 Ext.get('EST').dom.style.left =(vertexEST.EST1[0]+'px'); Ext.get('EST').dom.style.top =(vertexEST.EST1[1]+'px');Ext.get('EST').dom.style.width=(ESTsize[0]+'px'); Ext.get('EST').dom.style.height =((ESTsize[1]+'px'));
rlm@46 1497 Ext.get('WEST').dom.style.left =(vertexWEST.WEST1[0]+'px'); Ext.get('WEST').dom.style.top =(vertexWEST.WEST1[1]+'px');Ext.get('WEST').dom.style.width=(WESTsize[0]+'px'); Ext.get('WEST').dom.style.height =((WESTsize[1]+'px'));
rlm@46 1498 Ext.get('FRONT').dom.style.left =(vertexFRONT.FRONT1[0]+'px'); Ext.get('FRONT').dom.style.top =(vertexFRONT.FRONT1[1]+'px');Ext.get('FRONT').dom.style.width=(FRONTsize[0]+'px'); Ext.get('FRONT').dom.style.height =(FRONTsize[1]+'px');
rlm@46 1499
rlm@46 1500 Ext.get('richdraw').dom.style.left =(canvasX+'px'); Ext.get('richdraw').dom.style.top =(canvasY+'px');Ext.get('richdraw').dom.style.width=(canvasW+'px'); Ext.get('richdraw').dom.style.height =(canvasH+'px');
rlm@46 1501
rlm@46 1502 }
rlm@46 1503
rlm@46 1504 function documentProperties(){
rlm@46 1505 document.forms[0].xDocument.value=docx;
rlm@46 1506 document.forms[0].yDocument.value=docy;
rlm@46 1507
rlm@46 1508 document.forms[0].widthDocument.value=docw;
rlm@46 1509 document.forms[0].heightDocument.value=doch;
rlm@46 1510 showdocFrame('Document properties')
rlm@46 1511 //docFrame.setTitle('Document properties');
rlm@46 1512 //docFrame.show();
rlm@46 1513
rlm@46 1514 }
rlm@46 1515 function changeDocumentProperties(){
rlm@46 1516
rlm@46 1517 //percent of FRONTsize
rlm@46 1518 proporSpace= FRONTsize[0]/FRONTsize[1];
rlm@46 1519 //PERCENT
rlm@46 1520
rlm@46 1521 //canvasYpercent=95;
rlm@46 1522 //canvasXpercent=97;
rlm@46 1523 /*
rlm@46 1524 canvasWidth=Math.round(FRONTsize[0]*canvasXpercent/100);//FRONTsize[0];
rlm@46 1525 canvasW=canvasWidth;
rlm@46 1526 canvasHeight=Math.round(canvasYpercent*FRONTsize[1]/100);//FRONTsize[1];
rlm@46 1527 canvasH=canvasHeight;
rlm@46 1528 */
rlm@46 1529 docx=eval(document.forms[0].xDocument.value);
rlm@46 1530 docy=eval(document.forms[0].yDocument.value);
rlm@46 1531
rlm@46 1532 docw=eval(document.forms[0].widthDocument.value);
rlm@46 1533 doch=eval(document.forms[0].heightDocument.value);
rlm@46 1534 zoominit1= docx+' '+docy+' '+docw+' '+doch;
rlm@46 1535 c.renderer.view(docx,docy,docw,doch,zoominit1);
rlm@46 1536 borderDoc();
rlm@46 1537
rlm@46 1538 //doResize();
rlm@46 1539 //canvasX=Math.round((FRONTsize[0]-canvasW)/2);
rlm@46 1540 //canvasY=Math.round((FRONTsize[1]-canvasH)/2);
rlm@46 1541
rlm@46 1542
rlm@46 1543 //Ext.get('richdraw').dom.style.left =(canvasX+'px'); Ext.get('richdraw').dom.style.top =(canvasY+'px');Ext.get('richdraw').dom.style.width=(canvasW+'px'); Ext.get('richdraw').dom.style.height =(canvasH+'px');
rlm@46 1544
rlm@46 1545 }
rlm@46 1546 function makeWorkSite(width,left,top) {
rlm@46 1547 fieldViewx=Math.round(width*proporCanvas)*1;
rlm@46 1548 fieldViewy=width*1;
rlm@46 1549 diagonalFrame=dist2p(0,0,fieldViewx*1,fieldViewy*1);
rlm@46 1550 diagonalAngle=getAngle(fieldViewx,fieldViewy);
rlm@46 1551 diagonalMidx=fieldViewx/2;
rlm@46 1552 diagonalMidy=fieldViewy/2;
rlm@46 1553 centerZoomx=diagonalMidx;
rlm@46 1554 centerZoomy=diagonalMidy;
rlm@46 1555
rlm@46 1556 //alert(diagonalinit+' '+diagonalFrame+' '+proporDiagonal);
rlm@46 1557 //alert(canvasW+''+canvasW+' propor:'+proporCanvas+' Docy:'+docy+' fieldView:'+fieldViewx+' '+fieldViewy);
rlm@46 1558 zoomx=(diagonalMidx+(diagonalFrame/2)*Math.cos(diagonalAngle+Math.PI))+left;//-(fieldViewx/8);//-(canvasW/2)docx-fieldViewx;
rlm@46 1559 zoomy=(diagonalMidy+(diagonalFrame/2)*Math.sin(diagonalAngle+Math.PI))+top;//-(fieldViewy/8);//-(canvasH/2);//docy-fieldViewy;
rlm@46 1560 zoomw=diagonalMidx+(diagonalFrame/2)*Math.cos(diagonalAngle);//fieldViewx*1.25;//docw+fieldViewx*2;
rlm@46 1561 zoomh=diagonalMidy+(diagonalFrame/2)*Math.sin(diagonalAngle);//fieldViewy*1.25;//doch+fieldViewy*2;
rlm@46 1562 }
rlm@46 1563 function RichDrawViewer(elem, renderer) {
rlm@46 1564 this.container = elem;
rlm@46 1565 this.renderer = renderer;
rlm@46 1566 this.renderer.init(this.container);
rlm@46 1567 this.renderer.editor = this;
rlm@46 1568 }
rlm@46 1569 /*
rlm@46 1570 onResize : function(){
rlm@46 1571 Ext.TabPanel.superclass.onResize.apply(this, arguments);
rlm@46 1572 this.delegateUpdates();
rlm@46 1573 },
rlm@46 1574 */