Made improvements to extension support as well as connector extension
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1279 eee81c28-f429-11dd-99c0-75d572ba1dddmaster
Alexis Deveria
parent
1dcb9aac42
commit
d60fb28557
|
|
@ -1,11 +1,13 @@
|
|||
$(function() {
|
||||
svgCanvas.addExtension("Connector", function(vars) {
|
||||
|
||||
var svgcontent = vars.content;
|
||||
var getNextId = vars.getNextId;
|
||||
var addElem = vars.addSvgElementFromJson;
|
||||
var selManager = vars.selectorManager;
|
||||
var started = false,
|
||||
var svgcontent = vars.content,
|
||||
svgroot = vars.root,
|
||||
getNextId = vars.getNextId,
|
||||
getElem = vars.getElem,
|
||||
addElem = vars.addSvgElementFromJson,
|
||||
selManager = vars.selectorManager,
|
||||
started = false,
|
||||
start_x,
|
||||
start_y,
|
||||
cur_line,
|
||||
|
|
@ -16,12 +18,123 @@ $(function() {
|
|||
connect_str = "-SE_CONNECT-",
|
||||
selElems;
|
||||
|
||||
// Init code
|
||||
// (function() {
|
||||
//
|
||||
//
|
||||
// }());
|
||||
var lang_list = {
|
||||
"en":[
|
||||
{"id": "mode_connect", "title": "Connect two objects" },
|
||||
{"id": "conn_arrow_none", "textContent": "No arrow" },
|
||||
{"id": "conn_arrow_arrow", "textContent": "Arrow" }
|
||||
],
|
||||
"fr":[
|
||||
{"id": "mode_connect", "title": "Connecter deux objets"},
|
||||
{"id": "conn_arrow_none", "textContent": "Sans flèche" },
|
||||
{"id": "conn_arrow_arrow", "textContent": "Flèche" }
|
||||
]
|
||||
};
|
||||
|
||||
function showPanel(on) {
|
||||
var conn_rules = $('#connector_rules');
|
||||
if(!conn_rules.length) {
|
||||
conn_rules = $('<style id="connector_rules"><\/style>').appendTo('head');
|
||||
}
|
||||
conn_rules.text(!on?"":"#tool_clone, #tool_topath, #tool_angle, #xy_panel { display: none !important; }");
|
||||
$('#connector_panel').toggle(on);
|
||||
|
||||
if(on) {
|
||||
var has_arrow = selElems[0].getAttribute("marker-mid");
|
||||
$("#connector_arrow").val(has_arrow?"arrow":"none");
|
||||
}
|
||||
}
|
||||
|
||||
function setPoint(elem, pos, x, y, setMid) {
|
||||
var pts = elem.points;
|
||||
var pt = svgroot.createSVGPoint();
|
||||
pt.x = x;
|
||||
pt.y = y;
|
||||
if(pos === 'end') pos = pts.numberOfItems-1;
|
||||
// TODO: Test for this on init, then use alt only if needed
|
||||
try {
|
||||
pts.replaceItem(pt, pos);
|
||||
} catch(err) {
|
||||
// Should only occur in FF which formats points attr as "n,n n,n", so just split
|
||||
var pt_arr = elem.getAttribute("points").split(" ");
|
||||
for(var i=0; i< pt_arr.length; i++) {
|
||||
if(i == pos) {
|
||||
pt_arr[i] = x + ',' + y;
|
||||
}
|
||||
}
|
||||
elem.setAttribute("points",pt_arr.join(" "));
|
||||
}
|
||||
|
||||
if(setMid) {
|
||||
// Add center point
|
||||
var pt_start = pts.getItem(0);
|
||||
var pt_end = pts.getItem(pts.numberOfItems-1);
|
||||
setPoint(elem, 1, (pt_end.x + pt_start.x)/2, (pt_end.y + pt_start.y)/2);
|
||||
}
|
||||
}
|
||||
|
||||
function addArrow() {
|
||||
var defs = vars.findDefs();
|
||||
var m_id = "se_connector_arrow";
|
||||
var marker = getElem(m_id);
|
||||
|
||||
if(!marker) {
|
||||
marker = addElem({
|
||||
"element": "marker",
|
||||
"attr": {
|
||||
"viewBox": "0 0 10 10",
|
||||
"id": m_id,
|
||||
"refX": 5,
|
||||
"refY": 5,
|
||||
"markerUnits": "strokeWidth",
|
||||
"markerWidth": 16,
|
||||
"markerHeight": 14,
|
||||
"orient": "auto"
|
||||
}
|
||||
});
|
||||
var arrow = addElem({
|
||||
"element": "path",
|
||||
"attr": {
|
||||
"d": "M0,0 L10,5 L0,10 z",
|
||||
"fill": "#000"
|
||||
}
|
||||
});
|
||||
|
||||
marker.appendChild(arrow);
|
||||
defs.appendChild(marker);
|
||||
}
|
||||
|
||||
selElems[0].setAttribute("marker-mid", "url(#" + m_id + ")");
|
||||
}
|
||||
|
||||
function remArrow() {
|
||||
selElems[0].removeAttribute("marker-mid");
|
||||
}
|
||||
|
||||
// Init code
|
||||
(function() {
|
||||
var conn_tools = $('<div id="connector_panel">\
|
||||
<label><select id="connector_arrow">\
|
||||
<option id="conn_arrow_none" value="none">No arrow</option>\
|
||||
<option id="conn_arrow_arrow" value="arrow">Arrow</option>\
|
||||
</select></label></div>"').hide().appendTo("#tools_top");
|
||||
|
||||
$('#connector_arrow').change(function() {
|
||||
switch ( this.value ) {
|
||||
case "arrow":
|
||||
addArrow();
|
||||
break;
|
||||
case "none":
|
||||
remArrow();
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
vars.extendWhitelist({
|
||||
"marker": ["viewBox", "id", "refX", "refY", "markerUnits", "markerWidth", "markerHeight", "orient"],
|
||||
"polyline": ["class", "marker-mid"]
|
||||
});
|
||||
}());
|
||||
|
||||
return {
|
||||
name: "Connector",
|
||||
|
|
@ -30,12 +143,18 @@ $(function() {
|
|||
id: "mode_connect",
|
||||
type: "mode",
|
||||
icon: "images/cut.png",
|
||||
title: "Connect two objects",
|
||||
events: {
|
||||
'click': function() {
|
||||
svgCanvas.setMode("connector");
|
||||
}
|
||||
}
|
||||
}],
|
||||
addLangData: function(lang) {
|
||||
return {
|
||||
data: lang_list[lang]
|
||||
};
|
||||
},
|
||||
mouseDown: function(opts) {
|
||||
var e = opts.event;
|
||||
|
||||
|
|
@ -58,13 +177,9 @@ $(function() {
|
|||
|
||||
started = true;
|
||||
cur_line = addElem({
|
||||
"element": "line",
|
||||
"element": "polyline",
|
||||
"attr": {
|
||||
"x1": x,
|
||||
"y1": y,
|
||||
"x2": start_x,
|
||||
"y2": start_y,
|
||||
"id": getNextId(),
|
||||
"points": (x+','+y+' '+x+','+y+' '+start_x+','+start_y),
|
||||
"stroke": '#000',
|
||||
"stroke-width": 1,
|
||||
"fill": "none",
|
||||
|
|
@ -103,7 +218,6 @@ $(function() {
|
|||
var bb = svgCanvas.getStrokedBBox([elem]);
|
||||
var x = bb.x + bb.width/2;
|
||||
var y = bb.y + bb.height/2;
|
||||
|
||||
connections.push({
|
||||
elem: elem,
|
||||
connector: this,
|
||||
|
|
@ -128,8 +242,8 @@ $(function() {
|
|||
var mode = svgCanvas.getMode();
|
||||
|
||||
if(mode == "connector" && started) {
|
||||
cur_line.setAttributeNS(null, "x2", x);
|
||||
cur_line.setAttributeNS(null, "y2", y);
|
||||
// Set middle point for marker
|
||||
setPoint(cur_line, 'end', x, y, true);
|
||||
} else if(mode == "select") {
|
||||
var slen = selElems.length;
|
||||
|
||||
|
|
@ -141,18 +255,16 @@ $(function() {
|
|||
svgCanvas.getTransformList(elem).clear();
|
||||
}
|
||||
}
|
||||
|
||||
if(connections.length) {
|
||||
// Update line with element
|
||||
var i = connections.length;
|
||||
|
||||
while(i--) {
|
||||
var conn = connections[i];
|
||||
var line = conn.connector;
|
||||
var elem = conn.elem;
|
||||
var n = conn.is_start ? 1 : 2;
|
||||
line.setAttributeNS(null, "x"+n, conn.start_x + diff_x);
|
||||
line.setAttributeNS(null, "y"+n, conn.start_y + diff_y);
|
||||
var pt_x = conn.start_x + diff_x;
|
||||
var pt_y = conn.start_y + diff_y;
|
||||
setPoint(line, conn.is_start?0:'end', pt_x, pt_y, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -200,10 +312,8 @@ $(function() {
|
|||
var bb = svgCanvas.getStrokedBBox([end_elem]);
|
||||
var x = bb.x + bb.width/2;
|
||||
var y = bb.y + bb.height/2;
|
||||
cur_line.setAttributeNS(null, "x2", x);
|
||||
cur_line.setAttributeNS(null, "y2", y);
|
||||
setPoint(cur_line, 'end', x, y, true);
|
||||
cur_line.id = line_id;
|
||||
console.log('cur_line',cur_line.id);
|
||||
cur_line.setAttribute("class", conn_class);
|
||||
svgCanvas.addToSelection([cur_line]);
|
||||
svgCanvas.moveToBottomSelectedElement();
|
||||
|
|
@ -224,8 +334,6 @@ $(function() {
|
|||
|
||||
var i = selElems.length;
|
||||
|
||||
// var to_hide = $('#tool_clone, #tool_topath, div.toolset:has(#angle), #line_panel');
|
||||
|
||||
while(i--) {
|
||||
var elem = selElems[i];
|
||||
if(elem && elem.getAttribute('class') == conn_class) {
|
||||
|
|
@ -233,8 +341,12 @@ $(function() {
|
|||
|
||||
if(opts.selectedElement && !opts.multiselected) {
|
||||
// TODO: Set up context tools and hide most regular line tools
|
||||
|
||||
showPanel(true);
|
||||
} else {
|
||||
showPanel(false);
|
||||
}
|
||||
} else {
|
||||
showPanel(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,6 +37,10 @@ var put_locale = function(svgCanvas, given_param){
|
|||
|
||||
var processFile = function(data){
|
||||
var LangData = eval(data), js_strings;
|
||||
var more = svgCanvas.runExtensions("addLangData", lang_param);
|
||||
if(more) {
|
||||
LangData = $.merge(LangData, more.data);
|
||||
}
|
||||
$.each(LangData, function(i, data) {
|
||||
if(data.id) {
|
||||
var elem = $('#'+data.id)[0];
|
||||
|
|
|
|||
|
|
@ -422,7 +422,7 @@
|
|||
}
|
||||
|
||||
#tools_top label {
|
||||
margin-top: 3px;
|
||||
margin-top: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -147,9 +147,11 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
<div class="push_button" id="tool_reorient" title="Reorient path"></div>
|
||||
<div class="tool_sep"></div>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label id="group_opacityLabel" class="selected_tool" for="group_opacity">opac:</label>
|
||||
<input id="group_opacity" class="selected_tool" title="Change selected item opacity" size="3" value="100" type="text"/>
|
||||
<div class="toolset" id="tool_opacity">
|
||||
<label>
|
||||
<span id="group_opacityLabel">opac:</span>
|
||||
<input id="group_opacity" title="Change selected item opacity" size="3" value="100" type="text"/>
|
||||
</label>
|
||||
<div id="opacity_dropdown" class="dropdown">
|
||||
<button></button>
|
||||
<ul>
|
||||
|
|
@ -163,15 +165,19 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label id="angleLabel" class="selected_tool">angle:</label>
|
||||
<input id="angle" class="selected_tool" title="Change rotation angle" size="2" value="0" type="text"/>
|
||||
</div>
|
||||
|
||||
<label id="tool_angle">
|
||||
<span id="angleLabel">angle:</span>
|
||||
<input id="angle" title="Change rotation angle" size="2" value="0" type="text"/>
|
||||
</label>
|
||||
|
||||
<div id="xy_panel" class="toolset">
|
||||
<label class="selected_tool">x:</label>
|
||||
<input id="selected_x" class="selected_tool attr_changer" title="Change X coordinate" size="3" data-attr="x"/>
|
||||
<label class="selected_tool">y:</label>
|
||||
<input id="selected_y" class="selected_tool attr_changer" title="Change Y coordinate" size="3" data-attr="y"/>
|
||||
<label>
|
||||
x: <input id="selected_x" class="attr_changer" title="Change X coordinate" size="3" data-attr="x"/>
|
||||
</label>
|
||||
<label>
|
||||
y: <input id="selected_y" class="attr_changer" title="Change Y coordinate" size="3" data-attr="y"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -188,13 +194,15 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
<div class="push_button" id="tool_aligntop" title="Align Top"></div>
|
||||
<div class="push_button" id="tool_alignmiddle" title="Align Middle"></div>
|
||||
<div class="push_button" id="tool_alignbottom" title="Align Bottom"></div>
|
||||
<span id="relativeToLabel" class="selected_tool">relative to:</span>
|
||||
<select id="align_relative_to" class="selected_tool" title="Align relative to ...">
|
||||
<label id="tool_align_relative">
|
||||
<span id="relativeToLabel">relative to:</span>
|
||||
<select id="align_relative_to" title="Align relative to ...">
|
||||
<option id="selected_objects" value="selected">selected objects</option>
|
||||
<option id="largest_object" value="largest">largest object</option>
|
||||
<option id="smallest_object" value="smallest">smallest object</option>
|
||||
<option id="page" value="page">page</option>
|
||||
</select>
|
||||
</label>
|
||||
<div class="tool_sep"></div>
|
||||
|
||||
</div>
|
||||
|
|
@ -206,72 +214,89 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
|
||||
<div id="rect_panel">
|
||||
<div class="toolset">
|
||||
<label id="rwidthLabel" class="rect_tool">width:</label>
|
||||
<input id="rect_width" class="rect_tool attr_changer" title="Change rectangle width" size="3" data-attr="width"/>
|
||||
<label id="rheightLabel" class="rect_tool">height:</label>
|
||||
<input id="rect_height" class="rect_tool attr_changer" title="Change rectangle height" size="3" data-attr="height"/>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label id="cornerRadiusLabel" class="rect_tool">Corner Radius:</label>
|
||||
<input id="rect_rx" size="3" value="0" class="rect_tool" type="text" title="Change Rectangle Corner Radius" data-attr="Corner Radius"/>
|
||||
<label>
|
||||
<span id="rwidthLabel">width:</span>
|
||||
<input id="rect_width" class="attr_changer" title="Change rectangle width" size="3" data-attr="width"/>
|
||||
</label>
|
||||
<label>
|
||||
<span id="rheightLabel">height:</span>
|
||||
<input id="rect_height" class="attr_changer" title="Change rectangle height" size="3" data-attr="height"/>
|
||||
</label>
|
||||
</div>
|
||||
<label id="cornerRadiusLabel">Corner Radius:
|
||||
<input id="rect_rx" size="3" value="0" type="text" title="Change Rectangle Corner Radius" data-attr="Corner Radius"/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="image_panel">
|
||||
<div class="toolset">
|
||||
<label id="iwidthLabel" class="image_tool">width:</label>
|
||||
<input id="image_width" class="image_tool attr_changer" title="Change image width" size="3" data-attr="width"/>
|
||||
<label id="iheightLabel" class="image_tool">height:</label>
|
||||
<input id="image_height" class="image_tool attr_changer" title="Change image height" size="3" data-attr="height"/>
|
||||
<label id="iwidthLabel"><span id="iwidthLabel">width:</span>
|
||||
<input id="image_width" class="attr_changer" title="Change image width" size="3" data-attr="width"/>
|
||||
</label>
|
||||
<label><span id="iheightLabel">height:</span>
|
||||
<input id="image_height" class="attr_changer" title="Change image height" size="3" data-attr="height"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label class="image_tool">url:</label>
|
||||
<input id="image_url" class="image_tool" type="text" title="Change URL" size="35"/>
|
||||
<label id="tool_image_url">url:
|
||||
<input id="image_url" type="text" title="Change URL" size="35"/>
|
||||
<button id="change_image_url" style="display:none;">Change Image</button>
|
||||
<div id="url_notice" title="NOTE: This image cannot be embedded. It will depend on this path to be displayed"></div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="circle_panel">
|
||||
<div class="toolset">
|
||||
<label class="circle_tool">cx:</label>
|
||||
<input id="circle_cx" class="circle_tool attr_changer" title="Change circle's cx coordinate" size="3" data-attr="cx"/>
|
||||
<label class="circle_tool">cy:</label>
|
||||
<input id="circle_cy" class="circle_tool attr_changer" title="Change circle's cy coordinate" size="3" data-attr="cy"/>
|
||||
<label id="tool_ellipse_cx">cx:
|
||||
<input id="circle_cx" class="attr_changer" title="Change circle's cx coordinate" size="3" data-attr="cx"/>
|
||||
</label>
|
||||
<label id="tool_ellipse_cy">cy:
|
||||
<input id="circle_cy" class="attr_changer" title="Change circle's cy coordinate" size="3" data-attr="cy"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label class="circle_tool">r:</label>
|
||||
<input id="circle_r" class="circle_tool attr_changer" title="Change circle's radius" size="3" data-attr="r"/>
|
||||
<label id="tool_ellipse_r">r:
|
||||
<input id="circle_r" class="attr_changer" title="Change circle's radius" size="3" data-attr="r"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ellipse_panel">
|
||||
<div class="toolset">
|
||||
<label class="ellipse_tool">cx:</label>
|
||||
<input id="ellipse_cx" class="ellipse_tool attr_changer" title="Change ellipse's cx coordinate" size="3" data-attr="cx"/>
|
||||
<label class="ellipse_tool">cy:</label>
|
||||
<input id="ellipse_cy" class="ellipse_tool attr_changer" title="Change ellipse's cy coordinate" size="3" data-attr="cy"/>
|
||||
<label id="tool_ellipse_cx">cx:
|
||||
<input id="ellipse_cx" class="attr_changer" title="Change ellipse's cx coordinate" size="3" data-attr="cx"/>
|
||||
</label>
|
||||
<label id="tool_ellipse_cy">cy:
|
||||
<input id="ellipse_cy" class="attr_changer" title="Change ellipse's cy coordinate" size="3" data-attr="cy"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label class="ellipse_tool">rx:</label>
|
||||
<input id="ellipse_rx" class="ellipse_tool attr_changer" title="Change ellipse's x radius" size="3" data-attr="rx"/>
|
||||
<label class="ellipse_tool">ry:</label>
|
||||
<input id="ellipse_ry" class="ellipse_tool attr_changer" title="Change ellipse's y radius" size="3" data-attr="ry"/>
|
||||
<label id="tool_ellipse_rx">rx:
|
||||
<input id="ellipse_rx" class="attr_changer" title="Change ellipse's x radius" size="3" data-attr="rx"/>
|
||||
</label>
|
||||
<label id="tool_ellipse_ry">ry:
|
||||
<input id="ellipse_ry" class="attr_changer" title="Change ellipse's y radius" size="3" data-attr="ry"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="line_panel">
|
||||
<div class="toolset">
|
||||
<label class="line_tool">x1:</label>
|
||||
<input id="line_x1" class="line_tool attr_changer" title="Change line's starting x coordinate" size="3" data-attr="x1"/>
|
||||
<label class="line_tool">y1:</label>
|
||||
<input id="line_y1" class="line_tool attr_changer" title="Change line's starting y coordinate" size="3" data-attr="y1"/>
|
||||
<label id="tool_line_x1">x1:
|
||||
<input id="line_x1" class="attr_changer" title="Change line's starting x coordinate" size="3" data-attr="x1"/>
|
||||
</label>
|
||||
<label id="tool_line_y1">y1:
|
||||
<input id="line_y1" class="attr_changer" title="Change line's starting y coordinate" size="3" data-attr="y1"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toolset">
|
||||
<label class="line_tool">x2:</label>
|
||||
<input id="line_x2" class="line_tool attr_changer" title="Change line's ending x coordinate" size="3" data-attr="x2"/>
|
||||
<label class="line_tool">y2:</label>
|
||||
<input id="line_y2" class="line_tool attr_changer" title="Change line's ending y coordinate" size="3" data-attr="y2"/>
|
||||
<label id="tool_line_x2">x2:
|
||||
<input id="line_x2" class="attr_changer" title="Change line's ending x coordinate" size="3" data-attr="x2"/>
|
||||
</label>
|
||||
<label id="tool_line_y2">y2:
|
||||
<input id="line_y2" class="attr_changer" title="Change line's ending y coordinate" size="3" data-attr="y2"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -281,8 +306,8 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
<div class="tool_button" id="tool_italic" title="Italic Text [I]"><span></span>i</div>
|
||||
</div>
|
||||
|
||||
<div class="toolset">
|
||||
<input id="font_family" class="text_tool" type="text" title="Change Font Family" size="12"/>
|
||||
<div class="toolset" id="tool_font_family">
|
||||
<input id="font_family" type="text" title="Change Font Family" size="12"/>
|
||||
<div id="font_family_dropdown" class="dropdown">
|
||||
<button></button>
|
||||
<ul>
|
||||
|
|
@ -295,22 +320,24 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="toolset">
|
||||
<label id="font_sizeLabel" class="text_tool" for="font_size">size:</label>
|
||||
<input id="font_size" class="text_tool" title="Change Font Size" size="3" value="0" type="text"/>
|
||||
</div>
|
||||
<input id="text" class="text_tool" type="text" title="Change text contents" size="35"/>
|
||||
<label id="tool_font_size">
|
||||
<span id="font_sizeLabel">size:</span>
|
||||
<input id="font_size" title="Change Font Size" size="3" value="0" type="text"/>
|
||||
</label>
|
||||
<input id="text" type="text" title="Change text contents" size="35"/>
|
||||
</div>
|
||||
|
||||
<div id="path_node_panel">
|
||||
<div class="tool_sep"></div>
|
||||
<div class="tool_button" id="tool_node_link" title="Link Control Points"></div>
|
||||
<div class="tool_sep"></div>
|
||||
<label class="path_node_tool">x:</label>
|
||||
<input id="path_node_x" class="path_node_tool attr_changer" title="Change node's x coordinate" size="3" data-attr="x"/>
|
||||
<label class="path_node_tool">y:</label>
|
||||
<input id="path_node_y" class="path_node_tool attr_changer" title="Change node's y coordinate" size="3" data-attr="y"/>
|
||||
<select id="seg_type" class="path_node_tool" title="Change Segment type">
|
||||
<label id="tool_node_x">x:
|
||||
<input id="path_node_x" class="attr_changer" title="Change node's x coordinate" size="3" data-attr="x"/>
|
||||
</label>
|
||||
<label id="tool_node_y">y:</label>
|
||||
<input id="path_node_y" class="attr_changer" title="Change node's y coordinate" size="3" data-attr="y"/>
|
||||
</label>
|
||||
<select id="seg_type" title="Change Segment type">
|
||||
<option id="straight_segments" selected="selected" value="4">Straight</option>
|
||||
<option id="curve_segments" value="6">Curve</option>
|
||||
</select>
|
||||
|
|
@ -339,7 +366,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
<!-- Zoom buttons -->
|
||||
<div id="zoom_panel" class="magic_field">
|
||||
<span id="zoomLabel" class="zoom_tool label">zoom:</span>
|
||||
<input id="zoom" class="zoom_tool" title="Change zoom level" size="3" value="100" type="text" />
|
||||
<input id="zoom" title="Change zoom level" size="3" value="100" type="text" />
|
||||
<div id="zoom_dropdown" class="dropdown">
|
||||
<button></button>
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -298,6 +298,7 @@ function svg_edit_setup() {
|
|||
|
||||
var button = $('<div/>')
|
||||
.attr("id", id)
|
||||
.attr("title", btn.title)
|
||||
.addClass(cls)
|
||||
.appendTo(parent);
|
||||
if(!svgicons) {
|
||||
|
|
@ -1443,17 +1444,18 @@ function svg_edit_setup() {
|
|||
"#tools_top > div, #tools_top": {
|
||||
'line-height': {s: '17px', l: '34px', xl: '50px'}
|
||||
},
|
||||
"div.toolset": {
|
||||
'height': {s: '25px', l: '43px', xl: '64px'}
|
||||
},
|
||||
// "div.toolset, #tools_top label": {
|
||||
// 'height': {s: '25px', l: '43px', xl: '64px'}
|
||||
// },
|
||||
".dropdown button": {
|
||||
'height': {s: '18px', l: '34px', xl: '40px'},
|
||||
'line-height': {s: '18px', l: '34px', xl: '40px'},
|
||||
'margin-top': {s: '3px'}
|
||||
},
|
||||
"#tools_top label, #tools_bottom label": {
|
||||
"div.toolset, #tools_top label, #tools_bottom label": {
|
||||
'font-size': {s: '1em', l: '1.5em', xl: '2em'},
|
||||
'margin-top': {s: '1px', l: '3px', xl: '5px'}
|
||||
'margin-top': {s: '1px', l: '3px', xl: '5px'},
|
||||
'height': {s: '25px', l: '43px', xl: '64px'}
|
||||
},
|
||||
"#tool_bold, #tool_italic": {
|
||||
'font-size': {s: '1.5em', l: '3em', xl: '4.5em'}
|
||||
|
|
@ -2323,6 +2325,7 @@ function svg_edit_setup() {
|
|||
populateLayers();
|
||||
}
|
||||
|
||||
svgCanvas.runExtensions("langChanged", lang);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -977,9 +977,30 @@ function BatchCommand(text) {
|
|||
// Provide constants here (or should these be accessed through getSomething()?
|
||||
var ext = ext_func({
|
||||
content: svgcontent,
|
||||
root: svgroot,
|
||||
getNextId: getNextId,
|
||||
getElem: getElem,
|
||||
addSvgElementFromJson: addSvgElementFromJson,
|
||||
selectorManager: selectorManager
|
||||
selectorManager: selectorManager,
|
||||
findDefs: findDefs,
|
||||
// Probably only needed for extensions, so no need to make public?
|
||||
// Also, should we prevent extensions from allowing <script> elements to be added?
|
||||
extendWhitelist: function(new_data) {
|
||||
$.each(new_data, function(elname, attrs) {
|
||||
// add element
|
||||
if(!(elname in svgWhiteList)) {
|
||||
svgWhiteList[elname] = attrs;
|
||||
} else {
|
||||
$.each(attrs, function(i, attr) {
|
||||
// add attributes
|
||||
if($.inArray(attr, svgWhiteList[elname]) == -1) {
|
||||
svgWhiteList[elname].push(attr);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
extensions[name] = ext;
|
||||
call("extension_added", ext);
|
||||
|
|
|
|||
Loading…
Reference in New Issue