fixed indentation in ext-arrows

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@2429 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Bruno Heridet 2013-02-19 12:22:18 +00:00
parent 363bfb4cf2
commit bccb227cdd
1 changed files with 260 additions and 270 deletions

View File

@ -7,27 +7,25 @@
* *
*/ */
svgEditor.addExtension('Arrows', function(S) {
svgEditor.addExtension("Arrows", function(S) {
var svgcontent = S.svgcontent, var svgcontent = S.svgcontent,
addElem = S.addSvgElementFromJson, addElem = S.addSvgElementFromJson,
nonce = S.nonce, nonce = S.nonce,
randomize_ids = S.randomize_ids, randomize_ids = S.randomize_ids,
selElems; selElems,
lang_list = {
'en':[
{'id': 'arrow_none', 'textContent': 'No arrow' }
],
'fr':[
{'id': 'arrow_none', 'textContent': 'Sans flèche' }
]
},
prefix = 'se_arrow_';
svgCanvas.bind('setnonce', setArrowNonce); svgCanvas.bind('setnonce', setArrowNonce);
svgCanvas.bind('unsetnonce', unsetArrowNonce); svgCanvas.bind('unsetnonce', unsetArrowNonce);
var lang_list = {
"en":[
{"id": "arrow_none", "textContent": "No arrow" }
],
"fr":[
{"id": "arrow_none", "textContent": "Sans flèche" }
]
};
var prefix = 'se_arrow_';
if (randomize_ids) { if (randomize_ids) {
var arrowprefix = prefix + nonce + '_'; var arrowprefix = prefix + nonce + '_';
} else { } else {
@ -35,9 +33,9 @@ svgEditor.addExtension("Arrows", function(S) {
} }
var pathdata = { var pathdata = {
fw: {d:"m0,0l10,5l-10,5l5,-5l-5,-5z", refx:8, id: arrowprefix + 'fw'}, fw: {d: 'm0,0l10,5l-10,5l5,-5l-5,-5z', refx: 8, id: arrowprefix + 'fw'},
bk: {d:"m10,0l-10,5l10,5l-5,-5l5,-5z", refx:2, id: arrowprefix + 'bk'} bk: {d: 'm10,0l-10,5l10,5l-5,-5l5,-5z', refx: 2, id: arrowprefix + 'bk'}
} };
function setArrowNonce(window, n) { function setArrowNonce(window, n) {
randomize_ids = true; randomize_ids = true;
@ -65,40 +63,39 @@ svgEditor.addExtension("Arrows", function(S) {
function showPanel(on) { function showPanel(on) {
$('#arrow_panel').toggle(on); $('#arrow_panel').toggle(on);
if(on) { if(on) {
var el = selElems[0]; var el = selElems[0];
var end = el.getAttribute("marker-end"); var end = el.getAttribute('marker-end');
var start = el.getAttribute("marker-start"); var start = el.getAttribute('marker-start');
var mid = el.getAttribute("marker-mid"); var mid = el.getAttribute('marker-mid');
var val; var val;
if(end && start) { if(end && start) {
val = "both"; val = 'both';
} else if(end) { } else if(end) {
val = "end"; val = 'end';
} else if(start) { } else if(start) {
val = "start"; val = 'start';
} else if(mid) { } else if(mid) {
val = "mid"; val = 'mid';
if(mid.indexOf("bk") != -1) { if(mid.indexOf('bk') != -1) {
val = "mid_bk"; val = 'mid_bk';
} }
} }
if(!start && !mid && !end) { if(!start && !mid && !end) {
val = "none"; val = 'none';
} }
$("#arrow_list").val(val); $('#arrow_list').val(val);
} }
} }
function resetMarker() { function resetMarker() {
var el = selElems[0]; var el = selElems[0];
el.removeAttribute("marker-start"); el.removeAttribute('marker-start');
el.removeAttribute("marker-mid"); el.removeAttribute('marker-mid');
el.removeAttribute("marker-end"); el.removeAttribute('marker-end');
} }
function addMarker(dir, type, id) { function addMarker(dir, type, id) {
@ -106,32 +103,31 @@ svgEditor.addExtension("Arrows", function(S) {
id = id || arrowprefix + dir; id = id || arrowprefix + dir;
var marker = S.getElem(id); var marker = S.getElem(id);
var data = pathdata[dir]; var data = pathdata[dir];
if(type == "mid") { if(type == 'mid') {
data.refx = 5; data.refx = 5;
} }
if(!marker) { if(!marker) {
marker = addElem({ marker = addElem({
"element": "marker", 'element': 'marker',
"attr": { 'attr': {
"viewBox": "0 0 10 10", 'viewBox': '0 0 10 10',
"id": id, 'id': id,
"refY": 5, 'refY': 5,
"markerUnits": "strokeWidth", 'markerUnits': 'strokeWidth',
"markerWidth": 5, 'markerWidth': 5,
"markerHeight": 5, 'markerHeight': 5,
"orient": "auto", 'orient': 'auto',
"style": "pointer-events:none" // Currently needed for Opera 'style': 'pointer-events:none' // Currently needed for Opera
} }
}); });
var arrow = addElem({ var arrow = addElem({
"element": "path", 'element': 'path',
"attr": { 'attr': {
"d": data.d, 'd': data.d,
"fill": "#000000" 'fill': '#000000'
} }
}); });
marker.appendChild(arrow); marker.appendChild(arrow);
@ -147,32 +143,31 @@ svgEditor.addExtension("Arrows", function(S) {
var type = this.value; var type = this.value;
resetMarker(); resetMarker();
if(type == "none") { if(type == 'none') {
return; return;
} }
// Set marker on element // Set marker on element
var dir = "fw"; var dir = 'fw';
if(type == "mid_bk") { if(type == 'mid_bk') {
type = "mid"; type = 'mid';
dir = "bk"; dir = 'bk';
} else if(type == "both") { } else if(type == 'both') {
addMarker("bk", type); addMarker('bk', type);
svgCanvas.changeSelectedAttribute("marker-start", "url(#" + pathdata.bk.id + ")"); svgCanvas.changeSelectedAttribute('marker-start', 'url(#' + pathdata.bk.id + ')');
type = "end"; type = 'end';
dir = "fw"; dir = 'fw';
} else if (type == "start") { } else if (type == 'start') {
dir = "bk"; dir = 'bk';
} }
addMarker(dir, type); addMarker(dir, type);
svgCanvas.changeSelectedAttribute("marker-"+type, "url(#" + pathdata[dir].id + ")"); svgCanvas.changeSelectedAttribute('marker-' + type, 'url(#' + pathdata[dir].id + ')');
S.call("changed", selElems); S.call('changed', selElems);
} }
function colorChanged(elem) { function colorChanged(elem) {
var color = elem.getAttribute('stroke'); var color = elem.getAttribute('stroke');
var mtypes = ['start', 'mid', 'end']; var mtypes = ['start', 'mid', 'end'];
var defs = S.findDefs(); var defs = S.findDefs();
@ -205,14 +200,14 @@ svgEditor.addExtension("Arrows", function(S) {
$(new_marker).children().attr('fill', color); $(new_marker).children().attr('fill', color);
} }
$(elem).attr('marker-'+type, "url(#" + new_marker.id + ")"); $(elem).attr('marker-'+type, 'url(#' + new_marker.id + ')');
// Check if last marker can be removed // Check if last marker can be removed
var remove = true; var remove = true;
$(S.svgcontent).find('line, polyline, path, polygon').each(function() { $(S.svgcontent).find('line, polyline, path, polygon').each(function() {
var elem = this; var elem = this;
$.each(mtypes, function(j, mtype) { $.each(mtypes, function(j, mtype) {
if($(elem).attr('marker-' + mtype) === "url(#" + marker.id + ")") { if($(elem).attr('marker-' + mtype) === 'url(#' + marker.id + ')') {
return remove = false; return remove = false;
} }
}); });
@ -223,27 +218,25 @@ svgEditor.addExtension("Arrows", function(S) {
if(remove) { if(remove) {
$(marker).remove(); $(marker).remove();
} }
}); });
} }
return { return {
name: "Arrows", name: 'Arrows',
context_tools: [{ context_tools: [{
type: "select", type: 'select',
panel: "arrow_panel", panel: 'arrow_panel',
title: "Select arrow type", title: 'Select arrow type',
id: "arrow_list", id: 'arrow_list',
options: { options: {
none: "No arrow", none: 'No arrow',
end: "---->", end: '---->',
start: "<----", start: '<----',
both: "<--->", both: '<--->',
mid: "-->--", mid: '-->--',
mid_bk: "--<--" mid_bk: '--<--'
}, },
defval: "none", defval: 'none',
events: { events: {
change: setArrow change: setArrow
} }
@ -259,13 +252,11 @@ svgEditor.addExtension("Arrows", function(S) {
}; };
}, },
selectedChanged: function(opts) { selectedChanged: function(opts) {
// Use this to update the current selected elements // Use this to update the current selected elements
selElems = opts.elems; selElems = opts.elems;
var i = selElems.length; var i = selElems.length;
var marker_elems = ['line', 'path', 'polyline', 'polygon']; var marker_elems = ['line', 'path', 'polyline', 'polygon'];
while(i--) { while(i--) {
var elem = selElems[i]; var elem = selElems[i];
if(elem && $.inArray(elem.tagName, marker_elems) != -1) { if(elem && $.inArray(elem.tagName, marker_elems) != -1) {
@ -282,17 +273,16 @@ svgEditor.addExtension("Arrows", function(S) {
elementChanged: function(opts) { elementChanged: function(opts) {
var elem = opts.elems[0]; var elem = opts.elems[0];
if(elem && ( if(elem && (
elem.getAttribute("marker-start") || elem.getAttribute('marker-start') ||
elem.getAttribute("marker-mid") || elem.getAttribute('marker-mid') ||
elem.getAttribute("marker-end") elem.getAttribute('marker-end')
)) { )) {
// var start = elem.getAttribute("marker-start"); // var start = elem.getAttribute('marker-start');
// var mid = elem.getAttribute("marker-mid"); // var mid = elem.getAttribute('marker-mid');
// var end = elem.getAttribute("marker-end"); // var end = elem.getAttribute('marker-end');
// Has marker, so see if it should match color // Has marker, so see if it should match color
colorChanged(elem); colorChanged(elem);
} }
} }
}; };
}); });