Made more improvents to textedit mode, now works on transformed elements

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1517 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Alexis Deveria 2010-04-12 19:11:35 +00:00
parent 010d395590
commit 7ac3d0456b
4 changed files with 101 additions and 37 deletions

View File

@ -608,6 +608,11 @@ span.zoom_tool {
position: relative; position: relative;
} }
#text {
position: absolute;
left: -9999px;
}
#tool_bold span, #tool_italic span { #tool_bold span, #tool_italic span {
position: absolute; position: absolute;
width: 100%; width: 100%;

View File

@ -337,10 +337,9 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
<span id="font_sizeLabel">size:</span> <span id="font_sizeLabel">size:</span>
<input id="font_size" title="Change Font Size" size="3" value="0" type="text"/> <input id="font_size" title="Change Font Size" size="3" value="0" type="text"/>
</label> </label>
<label>
<!-- Text content --> <!-- Not visible, but still used -->
<input id="text" type="text" title="Change text contents" size="35"/> <input id="text" type="text" size="35"/>
</label>
</div> </div>
<div id="path_node_panel"> <div id="path_node_panel">

View File

@ -1221,6 +1221,7 @@
svgCanvas.bind("saved", saveHandler); svgCanvas.bind("saved", saveHandler);
svgCanvas.bind("zoomed", zoomChanged); svgCanvas.bind("zoomed", zoomChanged);
svgCanvas.bind("extension_added", extAdded); svgCanvas.bind("extension_added", extAdded);
svgCanvas.textActions.setInputElem($("#text")[0]);
var str = '<div class="palette_item" data-rgb="none"></div>' var str = '<div class="palette_item" data-rgb="none"></div>'
$.each(palette, function(i,item){ $.each(palette, function(i,item){

View File

@ -3183,7 +3183,7 @@ function BatchCommand(text) {
"xml:space": "preserve" "xml:space": "preserve"
} }
}); });
newText.textContent = "text"; // newText.textContent = "text";
break; break;
case "path": case "path":
// Fall through // Fall through
@ -3709,7 +3709,8 @@ function BatchCommand(text) {
break; break;
case "text": case "text":
keep = true; keep = true;
canvas.clearSelection(); canvas.addToSelection([element]);
textActions.start(element);
break; break;
case "path": case "path":
// set element to null here so that it is not removed nor finalized // set element to null here so that it is not removed nor finalized
@ -3865,7 +3866,7 @@ function BatchCommand(text) {
}()); }());
var textActions = function() { var textActions = canvas.textActions = function() {
var curtext; var curtext;
var textinput; var textinput;
var cursor; var cursor;
@ -3873,24 +3874,31 @@ function BatchCommand(text) {
var blinker; var blinker;
var chardata = []; var chardata = [];
var textbb; var textbb;
var xform, imatrix;
function setCursor(index) { function setCursor(index) {
var empty = (textinput.value === "");
if(!arguments.length) { if(!arguments.length) {
if(empty) {
index = 0;
} else {
index = textinput.selectionEnd; index = textinput.selectionEnd;
} }
}
var charbb; var charbb;
charbb = chardata[index]; charbb = chardata[index];
if(!empty) {
textinput.setSelectionRange(index, index); textinput.setSelectionRange(index, index);
}
cursor = getElem("text_cursor"); cursor = getElem("text_cursor");
if (!cursor) { if (!cursor) {
cursor = document.createElementNS(svgns, "line"); cursor = document.createElementNS(svgns, "line");
assignAttributes(cursor, { assignAttributes(cursor, {
'id': "text_cursor", 'id': "text_cursor",
'stroke': "#333", 'stroke': "#333",
'stroke-width': "1" 'stroke-width': 1
}); });
cursor = getElem("selectorParentGroup").appendChild(cursor); cursor = getElem("selectorParentGroup").appendChild(cursor);
} }
@ -3904,12 +3912,13 @@ function BatchCommand(text) {
} }
assignAttributes(cursor, { assignAttributes(cursor, {
x1: charbb.x, x1: charbb.x * current_zoom,
y1: textbb.y, y1: textbb.y * current_zoom,
x2: charbb.x, x2: charbb.x * current_zoom,
y2: textbb.y + textbb.height, y2: (textbb.y + textbb.height) * current_zoom,
visibility: 'visible', visibility: 'visible',
display: 'inline' display: 'inline',
transform: (xform || '')
}); });
if(selblock) selblock.setAttribute('width', 0); if(selblock) selblock.setAttribute('width', 0);
@ -3943,11 +3952,12 @@ function BatchCommand(text) {
cursor.setAttribute('visibility', 'hidden'); cursor.setAttribute('visibility', 'hidden');
assignAttributes(selblock, { assignAttributes(selblock, {
'x': startbb.x, 'x': startbb.x * current_zoom,
'y': textbb.y, 'y': textbb.y * current_zoom,
'width': endbb.x - startbb.x, 'width': (endbb.x - startbb.x) * current_zoom,
'height': textbb.height, 'height': textbb.height * current_zoom,
'display': 'inline' 'display': 'inline',
'transform': (xform || '')
}); });
} }
@ -3989,6 +3999,24 @@ function BatchCommand(text) {
setSelection(start, end, apply); setSelection(start, end, apply);
} }
function screenToPt(x_in, y_in) {
var out = {
x: x_in,
y: y_in
}
if(xform) {
var pt = transformPoint(out.x, out.y, imatrix);
out.x = pt.x;
out.y = pt.y;
}
out.x /= current_zoom;
out.y /= current_zoom;
return out;
}
var last_x, last_y; var last_x, last_y;
return { return {
@ -4000,17 +4028,27 @@ function BatchCommand(text) {
curtext = target; curtext = target;
} }
}, },
start: function(elem) {
curtext = elem;
textActions.toEditMode();
},
mouseDown: function(evt, mouse_target, start_x, start_y) { mouseDown: function(evt, mouse_target, start_x, start_y) {
var pt = screenToPt(start_x, start_y);
textinput.focus(); textinput.focus();
setCursorFromPoint(start_x, start_y); setCursorFromPoint(pt.x, pt.y);
last_x = start_x; last_x = start_x;
last_y = start_y; last_y = start_y;
// TODO: Find way to block native selection
}, },
mouseMove: function(mouse_x, mouse_y) { mouseMove: function(mouse_x, mouse_y) {
setEndSelectionFromPoint(mouse_x, mouse_y); var pt = screenToPt(mouse_x, mouse_y);
setEndSelectionFromPoint(pt.x, pt.y);
}, },
mouseUp: function(evt, mouse_x, mouse_y) { mouseUp: function(evt, mouse_x, mouse_y) {
setEndSelectionFromPoint(mouse_x, mouse_y, true); var pt = screenToPt(mouse_x, mouse_y);
setEndSelectionFromPoint(pt.x, pt.y, true);
if(last_x === mouse_x && last_y === mouse_y && evt.target !== curtext) { if(last_x === mouse_x && last_y === mouse_y && evt.target !== curtext) {
textActions.toSelectMode(); textActions.toSelectMode();
} }
@ -4024,31 +4062,50 @@ function BatchCommand(text) {
textActions.init(); textActions.init();
$(curtext).css('cursor', 'text'); $(curtext).css('cursor', 'text');
setCursorFromPoint(x, y); if(!arguments.length) {
setCursor();
} else {
var pt = screenToPt(x, y);
setCursorFromPoint(pt.x, pt.y);
}
}, },
toSelectMode: function() { toSelectMode: function() {
current_mode = "select"; current_mode = "select";
clearInterval(blinker); clearInterval(blinker);
blinker = null;
if(selblock) $(selblock).attr('display','none'); if(selblock) $(selblock).attr('display','none');
if(cursor) $(cursor).attr('display','none'); if(cursor) $(cursor).attr('visibility','hidden');
canvas.clearSelection(); canvas.clearSelection();
$(curtext).css('cursor', 'move');
call("selected", [curtext]); call("selected", [curtext]);
canvas.addToSelection([curtext], true); canvas.addToSelection([curtext], true);
curtext = false; curtext = false;
}, },
init: function() { setInputElem: function(elem) {
textinput = elem;
},
init: function(inputElem) {
if(!curtext) return;
if(!curtext.parentNode) {
curtext = selectedElements[0];
selectorManager.requestSelector(curtext).showGrips(false);
}
var str = curtext.textContent; var str = curtext.textContent;
var len = str.length; var len = str.length;
xform = curtext.getAttribute('transform');
if(xform) {
var tlist = canvas.getTransformList(curtext);
imatrix = transformListToTransform(tlist).matrix.inverse();
}
textbb = canvas.getBBox(curtext); textbb = canvas.getBBox(curtext);
chardata = Array(len); chardata = Array(len);
// TODO: This element should be dynamically created and hidden
// For now we use the svg-editor one for visibility purposes
textinput = $('#text')[0];
textinput.focus(); textinput.focus();
$(textinput).blur(function() { $(textinput).blur(function() {
if(cursor) { if(cursor) {
@ -4056,6 +4113,10 @@ function BatchCommand(text) {
} }
}); });
if(!len) {
var end = {x: textbb.x + (textbb.width/2)};
}
for(var i=0; i<len; i++) { for(var i=0; i<len; i++) {
var start = curtext.getStartPositionOfChar(i); var start = curtext.getStartPositionOfChar(i);
var end = curtext.getEndPositionOfChar(i); var end = curtext.getEndPositionOfChar(i);
@ -4072,10 +4133,12 @@ function BatchCommand(text) {
}; };
} }
// Add a last bbox for cursor at end of text // Add a last bbox for cursor at end of text
chardata.push({ chardata.push({
x: end.x x: end.x
}); });
} }
} }
}(); }();
@ -7675,7 +7738,7 @@ function BatchCommand(text) {
this.setTextContent = function(val) { this.setTextContent = function(val) {
this.changeSelectedAttribute("#text", val); this.changeSelectedAttribute("#text", val);
textActions.init(); textActions.init(val);
textActions.setCursor(); textActions.setCursor();
}; };
@ -7739,10 +7802,6 @@ function BatchCommand(text) {
var ffClone = function(elem) { var ffClone = function(elem) {
// Hack for Firefox bugs where text element features aren't updated // Hack for Firefox bugs where text element features aren't updated
// May not be necessary, so let's try disabling.
return elem;
if(navigator.userAgent.indexOf('Gecko/') == -1) return elem; if(navigator.userAgent.indexOf('Gecko/') == -1) return elem;
var clone = elem.cloneNode(true) var clone = elem.cloneNode(true)
elem.parentNode.insertBefore(clone, elem); elem.parentNode.insertBefore(clone, elem);