348 lines
17 KiB
XML
348 lines
17 KiB
XML
<?xml version="1.0" encoding="UTF-8" ?>
|
|
<Module>
|
|
<ModulePrefs title="SVG-edit" height="780" author="SVG-edit Developers">
|
|
<Require feature="wave" />
|
|
</ModulePrefs>
|
|
<Content type="html">
|
|
<![CDATA[
|
|
|
|
<base href="http://svg-edit.googlecode.com/svn/trunk/editor/svg-editor.html"></base>
|
|
<link rel="stylesheet" href="http://svg-edit.googlecode.com/svn/trunk/editor/jpicker/jpicker.css" type="text/css"/>
|
|
<link rel="stylesheet" href="http://svg-edit.googlecode.com/svn/trunk/editor/svg-editor.css" type="text/css"/>
|
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/js-hotkeys/jquery.hotkeys.min.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/jgraduate/jpicker-1.0.9.min.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/jgraduate/jquery.jgraduate.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/spinbtn/JQuerySpinBtn.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/svgcanvas.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/editor/svg-editor.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/wave/json2.js"></script>
|
|
<script type="text/javascript" src="http://svg-edit.googlecode.com/svn/trunk/wave/wave.js"></script>
|
|
|
|
|
|
|
|
<div id="svg_editor">
|
|
|
|
<div id="workarea">
|
|
<style id="styleoverrides" type="text/css"></style>
|
|
<div id="svgcanvas"></div>
|
|
</div>
|
|
|
|
<div id="sidepanels" style="display:none">
|
|
<p><b>TODO: Side Panels go here.</b></p>
|
|
<p><b>By default, this panel will be collapsed. It will be expandable by some button/handle.</b></p>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
</div>
|
|
|
|
<div id="logo">
|
|
<a href="http://svg-edit.googlecode.com/" target="_blank" title="SVG-edit Home Page">
|
|
<img src="images/logo.png" alt="logo" />
|
|
</a>
|
|
</div>
|
|
|
|
<div id="tools_top" class="tools_panel">
|
|
|
|
<!-- File-like buttons: New, Save, Source -->
|
|
<div id="file_panel">
|
|
<img class="tool_button" id="tool_clear" src="images/clear.png" title="New Image [N]" alt="Clear" />
|
|
<img style="display:none" class="tool_button" id="tool_open" src="images/open.png" title="Open Image [O]" alt="Open"/>
|
|
<img class="tool_button" id="tool_save" src="images/save.png" title="Save Image [S]" alt="Save"/>
|
|
<img class="tool_button" id="tool_source" src="images/source.png" title="Edit Source [U]" alt="Source"/>
|
|
<img class="tool_button" id="tool_docprops" src="images/document-properties.png" title="Document Properties [I]"/>
|
|
</div>
|
|
|
|
<!-- History buttons -->
|
|
<div id="history_panel">
|
|
<div class="tool_sep" alt="|"></div>
|
|
<div class="tool_button tool_button_disabled" id="tool_undo" title="Undo [Z]"></div>
|
|
<div class="tool_button tool_button_disabled" id="tool_redo" title="Redo [Y]"></div>
|
|
</div>
|
|
|
|
<!-- Buttons when a single element is selected -->
|
|
<div id="selected_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<img class="tool_button" id="tool_clone" src="images/clone.png" title="Clone Element [C]" alt="Copy"/>
|
|
<img class="tool_button" id="tool_delete" src="images/delete.png" title="Delete Element [Delete/Backspace]" alt="Delete"/>
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<img class="tool_button" id="tool_move_top" src="images/move_top.png" title="Move to Top [Shift+Up]" alt="Top"/>
|
|
<img class="tool_button" id="tool_move_bottom" src="images/move_bottom.png" title="Move to Bottom [Shift+Down]" alt="Bottom"/>
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<select id="group_opacity" class="selected_tool" title="Change selected item opacity">
|
|
<option selected="selected" value="1">100 %</option>
|
|
<option value="0.9">90 %</option>
|
|
<option value="0.8">80 %</option>
|
|
<option value="0.7">70 %</option>
|
|
<option value="0.6">60 %</option>
|
|
<option value="0.5">50 %</option>
|
|
<option value="0.4">40 %</option>
|
|
<option value="0.3">30 %</option>
|
|
<option value="0.2">20 %</option>
|
|
<option value="0.1">10 %</option>
|
|
<option value="0">0 %</option>
|
|
</select>
|
|
<span class="selected_tool">angle:</span>
|
|
<input id="angle" class="selected_tool" title="Change rotation angle" alt="Rotation Angle" size="2" value="0" type="text"/>
|
|
</div>
|
|
|
|
<!-- Buttons when multiple elements are selected -->
|
|
<div id="multiselected_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<img class="tool_button" id="tool_clone_multi" src="images/clone.png" title="Clone Elements [C]" alt="Clone"/>
|
|
<img class="tool_button" id="tool_delete_multi" src="images/delete.png" title="Delete Selected Elements [Delete/Backspace]" alt="Delete"/>
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<div class="tool_button" id="tool_alignleft" title="Align Left"></div>
|
|
<div class="tool_button" id="tool_aligncenter" title="Align Center"></div>
|
|
<div class="tool_button" id="tool_alignright" title="Align Right"></div>
|
|
<div class="tool_button" id="tool_aligntop" title="Align Top"></div>
|
|
<div class="tool_button" id="tool_alignmiddle" title="Align Middle"></div>
|
|
<div class="tool_button" id="tool_alignbottom" title="Align Bottom"></div>
|
|
<span class="selected_tool">relative to:</span>
|
|
<select id="align_relative_to" class="selected_tool" title="Align relative to ...">
|
|
<option value="selected">selected objects</option>
|
|
<option value="largest">largest object</option>
|
|
<option value="smallest">smallest object</option>
|
|
<option value="page">page</option>
|
|
</select>
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<img class="tool_button" id="tool_group" src="images/shape_group.png" title="Group Elements [G]" alt="Group"/>
|
|
</div>
|
|
|
|
<div id="g_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<img class="tool_button" id="tool_ungroup" src="images/shape_ungroup.png" title="Ungroup Elements [G]" alt="Ungroup"/>
|
|
</div>
|
|
|
|
<div id="rect_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="rect_tool">x:</label>
|
|
<input id="rect_x" class="rect_tool attr_changer" title="Change rectangle X coordinate" alt="x" size="3"/>
|
|
<label class="rect_tool">y:</label>
|
|
<input id="rect_y" class="rect_tool attr_changer" title="Change rectangle Y coordinate" alt="y" size="3"/>
|
|
<label class="rect_tool">width:</label>
|
|
<input id="rect_width" class="rect_tool attr_changer" title="Change rectangle width" alt="width" size="3"/>
|
|
<label class="rect_tool">height:</label>
|
|
<input id="rect_height" class="rect_tool attr_changer" title="Change rectangle height" alt="height" size="3"/>
|
|
<label class="rect_tool">Corner Radius:</label>
|
|
<input id="rect_rx" size="3" value="0" class="rect_tool" type="text" title="Change Rectangle Corner Radius" alt="Corner Radius"/>
|
|
</div>
|
|
|
|
<div id="image_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="image_tool">x:</label>
|
|
<input id="image_x" class="image_tool attr_changer" title="Change image X coordinate" alt="x" size="3"/>
|
|
<label class="image_tool">y:</label>
|
|
<input id="image_y" class="image_tool attr_changer" title="Change image Y coordinate" alt="y" size="3"/>
|
|
<label class="image_tool">width:</label>
|
|
<input id="image_width" class="image_tool attr_changer" title="Change image width" alt="width" size="3"/>
|
|
<label class="image_tool">height:</label>
|
|
<input id="image_height" class="image_tool attr_changer" title="Change image height" alt="height" size="3"/>
|
|
<label class="image_tool">url:</label>
|
|
<input id="image_url" class="image_tool" type="text" title="Change URL" size="35"/>
|
|
</div>
|
|
|
|
|
|
<div id="circle_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="circle_tool">cx:</label>
|
|
<input id="circle_cx" class="circle_tool attr_changer" title="Change circle's cx coordinate" alt="cx" size="3"/>
|
|
<label class="circle_tool">cy:</label>
|
|
<input id="circle_cy" class="circle_tool attr_changer" title="Change circle's cy coordinate" alt="cy" size="3"/>
|
|
<label class="circle_tool">r:</label>
|
|
<input id="circle_r" class="circle_tool attr_changer" title="Change circle's radius" alt="r" size="3"/>
|
|
</div>
|
|
|
|
<div id="ellipse_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="ellipse_tool">cx:</label>
|
|
<input id="ellipse_cx" class="ellipse_tool attr_changer" title="Change ellipse's cx coordinate" alt="cx" size="3"/>
|
|
<label class="ellipse_tool">cy:</label>
|
|
<input id="ellipse_cy" class="ellipse_tool attr_changer" title="Change ellipse's cy coordinate" alt="cy" size="3"/>
|
|
<label class="ellipse_tool">rx:</label>
|
|
<input id="ellipse_rx" class="ellipse_tool attr_changer" title="Change ellipse's x radius" alt="rx" size="3"/>
|
|
<label class="ellipse_tool">ry:</label>
|
|
<input id="ellipse_ry" class="ellipse_tool attr_changer" title="Change ellipse's y radius" alt="ry" size="3"/>
|
|
</div>
|
|
|
|
<div id="line_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="line_tool">x1:</label>
|
|
<input id="line_x1" class="line_tool attr_changer" title="Change line's starting x coordinate" alt="x1" size="3"/>
|
|
<label class="line_tool">y1:</label>
|
|
<input id="line_y1" class="line_tool attr_changer" title="Change line's starting y coordinate" alt="y1" size="3"/>
|
|
<label class="line_tool">x2:</label>
|
|
<input id="line_x2" class="line_tool attr_changer" title="Change line's ending x coordinate" alt="x2" size="3"/>
|
|
<label class="line_tool">y2:</label>
|
|
<input id="line_y2" class="line_tool attr_changer" title="Change line's ending y coordinate" alt="x1" size="3"/>
|
|
</div>
|
|
|
|
<div id="text_panel">
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
<label class="text_tool">x:</label>
|
|
<input id="text_x" class="text_tool attr_changer" title="Change text X coordinate" alt="x" size="3"/>
|
|
<label class="text_tool">y:</label>
|
|
<input id="text_y" class="text_tool attr_changer" title="Change text Y coordinate" alt="y" size="3"/>
|
|
<img class="tool_button" id="tool_bold" src="images/bold.png" title="Bold Text [B]" alt="Bold"/>
|
|
<img class="tool_button" id="tool_italic" src="images/italic.png" title="Italic Text [I]" alt="Italic"/>
|
|
<select id="font_family" class="text_tool" title="Change Font Family">
|
|
<option selected="selected" value="serif">serif</option>
|
|
<option value="sans-serif">sans-serif</option>
|
|
<option value="cursive">cursive</option>
|
|
<option value="fantasy">fantasy</option>
|
|
<option value="monospace">monospace</option>
|
|
</select>
|
|
<select id="font_size" class="text_tool" title="Change Font Size">
|
|
<option value="6pt">6pt</option>
|
|
<option value="8pt">8pt</option>
|
|
<option value="10pt">10pt</option>
|
|
<option selected="selected" value="12pt">12pt</option>
|
|
<option value="14pt">14pt</option>
|
|
<option value="16pt">16pt</option>
|
|
<option value="20pt">20pt</option>
|
|
<option value="24pt">24pt</option>
|
|
<option value="32pt">32pt</option>
|
|
<option value="48pt">48pt</option>
|
|
<option value="64pt">64pt</option>
|
|
<option value="72pt">72pt</option>
|
|
<option value="80pt">80pt</option>
|
|
<option value="96pt">96pt</option>
|
|
<option value="120pt">120pt</option>
|
|
</select>
|
|
<input id="text" class="text_tool" type="text" title="Change text contents" size="35"/>
|
|
</div>
|
|
</div> <!-- tools_top -->
|
|
|
|
<div id="tools_left" class="tools_panel">
|
|
<img class="tool_button_current" id="tool_select" src="images/select.png" title="Select Tool [1]" alt="Select"/><br/>
|
|
<img class="tool_button" id="tool_path" src="images/path.png" title="Pencil Tool [2]" alt="Pencil"/><br/>
|
|
<img class="tool_button" id="tool_line" src="images/line.png" title="Line Tool [3]" alt="Line"/><br/>
|
|
<img class="tool_button" id="tools_rect_show" src="images/square.png" title="Square/Rect Tool [4/Shift+4]" alt="Square"/>
|
|
<img class="flyout_arrow_horiz" src="images/flyouth.png"/>
|
|
<img class="tool_button" id="tools_ellipse_show" src="images/circle.png" title="Ellipse/Circle Tool [5/Shift+5]" alt="Circle"/><br/>
|
|
<img class="flyout_arrow_horiz" src="images/flyouth.png"/>
|
|
<img class="tool_button" id="tool_text" src="images/text.png" title="Text Tool [6]" alt="Text"/>
|
|
<img class="tool_button" id="tool_poly" src="images/polygon.png" title="Poly Tool [7]" alt="Poly"/>
|
|
<img class="tool_button" id="tool_image" src="images/image.png" title="Image Tool [8]" alt="Image"/>
|
|
<img class="tool_button" id="tool_zoom" src="images/zoom.png" title="Zoom Tool [Ctrl+Up/Down]" alt="Zoom"/>
|
|
</div> <!-- tools_left -->
|
|
|
|
<div id="tools_bottom" class="tools_panel">
|
|
|
|
<!-- Zoom buttons -->
|
|
<div id="zoom_panel">
|
|
<span class="zoom_tool">zoom:</span>
|
|
<input id="zoom" class="zoom_tool" title="Change zoom level" alt="Zoom %" size="3" value="100" type="text"/>
|
|
<div id="zoom_dropdown">
|
|
<button></button>
|
|
<ul>
|
|
<li>100%</li>
|
|
<li data-val="content">Fit to content</li>
|
|
<li data-val="selection">Fit to selection</li>
|
|
<li data-val="canvas">Fit to canvas</li>
|
|
<li>25%</li>
|
|
<li>50%</li>
|
|
<li>100%</li>
|
|
<li>200%</li>
|
|
<li>400%</li>
|
|
<li>1000%</li>
|
|
</ul>
|
|
</div>
|
|
<img class="tool_sep" src="images/sep.png" alt="|"/>
|
|
</div>
|
|
|
|
<div id="tools_bottom_2">
|
|
<table>
|
|
<tr>
|
|
<td>fill:</td>
|
|
<td><div id="fill_color" class="color_block" title="Change fill color"></div></td>
|
|
<td><div id="fill_opacity">100%</div></td>
|
|
</tr><tr>
|
|
<td>stroke:</td>
|
|
<td><div id="stroke_color" class="color_block" title="Change stroke color"></div></td>
|
|
<td><div id="stroke_opacity">100 %</div></td>
|
|
<td>
|
|
<input id="stroke_width" title="Change stroke width" alt="Stroke Width" size="2" value="5" type="text"/>
|
|
</td>
|
|
<td>
|
|
<select id="stroke_style" title="Change stroke dash style">
|
|
<option selected="selected" value="none">---</option>
|
|
<option value="2,2">...</option>
|
|
<option value="5,5">- -</option>
|
|
<option value="5,2,2,2">- .</option>
|
|
<option value="5,2,2,2,2,2">- ..</option>
|
|
</select>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div id="tools_bottom_3">
|
|
<div id="palette_holder"><div id="palette" title="Click to change fill color, shift-click to change stroke color"></div></div>
|
|
<div id="copyright">Powered by <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.4-unstable</a></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- hidden divs -->
|
|
<div id="color_picker"></div>
|
|
|
|
<div id="tools_rect" class="tools_flyout">
|
|
<div id="tool_square" class="tool_flyout_button" title="Square"></div>
|
|
<div id="tool_rect" class="tool_flyout_button" title="Rectangle"></div>
|
|
<div id="tool_fhrect" class="tool_flyout_button" title="Free-Hand Rectangle"></div>
|
|
</div>
|
|
|
|
<div id="tools_ellipse" class="tools_flyout">
|
|
<div id="tool_circle" class="tool_flyout_button" title="Circle"></div>
|
|
<div id="tool_ellipse" class="tool_flyout_button" title="Ellipse"></div>
|
|
<div id="tool_fhellipse" class="tool_flyout_button" title="Free-Hand Ellipse"></div>
|
|
</div>
|
|
|
|
</div> <!-- svg_editor -->
|
|
|
|
<div id="svg_source_editor">
|
|
<div id="svg_source_overlay"></div>
|
|
<div id="svg_source_container">
|
|
<div id="tool_source_back" class="toolbar_button">
|
|
<button id="tool_source_save">Save</button>
|
|
<button id="tool_source_cancel">Cancel</button>
|
|
</div>
|
|
<form>
|
|
<textarea id="svg_source_textarea"></textarea>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="svg_docprops">
|
|
<div id="svg_docprops_overlay"></div>
|
|
<div id="svg_docprops_container">
|
|
<div id="tool_docprops_back" class="toolbar_button">
|
|
<button id="tool_docprops_save">Save</button>
|
|
<button id="tool_docprops_cancel">Cancel</button>
|
|
|
|
<div id="change_background">
|
|
<label>Canvas Background:</label>
|
|
<div id="bkgnd_color" class="color_block" title="Change background color/opacity"></div>
|
|
</div>
|
|
|
|
<div id="change_resolution">
|
|
<label>Resolution:</label>
|
|
<select id="resolution" label="Resolution:">
|
|
<option selected="selected">640x480</option>
|
|
<option>800x600</option>
|
|
<option>1024x768</option>
|
|
<option>1280x960</option>
|
|
<option>1600x1200</option>
|
|
<option>Fit to Content</option>
|
|
<option>Custom</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
]]>
|
|
</Content>
|
|
</Module>
|