71 lines
2.4 KiB
HTML
71 lines
2.4 KiB
HTML
<html>
|
|
<head>
|
|
|
|
<script src="jquery-1.3.js" type="text/javascript"></script>
|
|
<link rel="stylesheet" media="screen" type="text/css" href="colorpicker/css/colorpicker.css" />
|
|
<script type="text/javascript" src="colorpicker/js/colorpicker.js"></script>
|
|
<script language="JavaScript" type="text/javascript" src="SvgEditor.js"></script>
|
|
|
|
<script language="javascript" type="text/javascript" src="simple-colorpicker/jquery.colorPicker.js"/></script><link rel="stylesheet" href="simple-colorpicker/colorPicker.css" type="text/css" />
|
|
|
|
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<table border="1">
|
|
<tr><td> Draw Your SVG image here </td><td> Control </td></tr>
|
|
|
|
<tr><td>
|
|
|
|
<div>
|
|
<object data="blank.svg" type="image/svg+xml" width="350px" height="360px">
|
|
<embed src="blank.svg" type="image/svg+xml" width="350px" height="360px">
|
|
</object>
|
|
</div>
|
|
|
|
</td><td>
|
|
|
|
|
|
|
|
<div id="control_box">
|
|
<input type="button" value="clear" onclick="window.clear_svg()">
|
|
<input type="button" value="path" onclick="window.set_draw_mode('path')">
|
|
<input type="button" value="rect" onclick="window.set_draw_mode('rect')">
|
|
<input type="button" value="line" onclick="window.set_draw_mode('line')">
|
|
</br>
|
|
<input type="button" value="circle" onclick="window.set_draw_mode('ellipse')">
|
|
<input type="button" value="freehandcircle" onclick="window.set_draw_mode('freehandcircle')">
|
|
<input type="button" value="save" onclick="window.submit_svg()">
|
|
<input type="button" value="delete" onclick="window.set_draw_mode('delete')">
|
|
</br>
|
|
|
|
Select Stroke Color
|
|
<input type="button" title="select stroke color" id="colorSelectorStroke">
|
|
<input id="color1" type="text" name="color1" value="#333399" onchange="window.set_stroke_color(this.value); var col = this.value ; f1(col);"/></div>
|
|
</br>
|
|
Stroke Width <select onchange="window.set_stroke_width(this.options[this.selectedIndex].value )" id="linewidth">
|
|
<option value="1px">1px</option>
|
|
<option value="2px">2px</option>
|
|
<option value="3px">3px</option>
|
|
<option value="5px">5px</option>
|
|
<option value="7px">7px</option>
|
|
</select>
|
|
|
|
</br>
|
|
Select Fill Color
|
|
<div title="select fill color" id="colorSelectorFill"></div>
|
|
<input id="color2" type="text" name="color2" value="#333399" onchange="window.set_fill_color(this.value); var col = this.value ; $('#colorSelectorFill').ColorPickerSetColor(col);" /></div>
|
|
|
|
<input type="button" value="empty fill" onclick="window.set_fill_color('none'); $('#colorSelectorFill').css('backgroundColor', '#ffffff');">
|
|
</div>
|
|
|
|
</br>
|
|
|
|
|
|
|
|
|
|
</td></tr></table>
|
|
</body>
|
|
</html>
|