Fix Issue 233: Highlight the layer when its name is hovered

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@825 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Jeff Schiller 2009-10-14 05:11:51 +00:00
parent ca67ea8af2
commit 8ce44e7755
2 changed files with 79 additions and 8 deletions

View File

@ -1257,7 +1257,6 @@ function svg_edit_setup() {
$('#sidepanel_handle')
.mousedown(function(evt) {sidedrag = evt.pageX;})
.mouseup(function(evt) {sidedrag = -1;});
// TODO: is there a better way to do this splitter without attaching mouse handlers here?
$('#svg_editor')
.mouseup(function(){sidedrag=-1;})
.mouseout(function(evt){
@ -1308,6 +1307,26 @@ function svg_edit_setup() {
layerpanel.css('width', parseInt(layerpanel.css('width'))+deltax);
centerCanvasIfNeeded();
};
// this function highlights the layer passed in (by fading out the other layers)
// if no layer is passed in, this function restores the other layers
var toggleHighlightLayer = function(layerNameToHighlight) {
var curNames = new Array(svgCanvas.getNumLayers());
for (var i = 0; i < curNames.length; ++i) { curNames[i] = svgCanvas.getLayer(i); }
if (layerNameToHighlight) {
for (var i = 0; i < curNames.length; ++i) {
if (curNames[i] != layerNameToHighlight) {
svgCanvas.setLayerOpacity(curNames[i], 0.5);
}
}
}
else {
for (var i = 0; i < curNames.length; ++i) {
svgCanvas.setLayerOpacity(curNames[i], 1.0);
}
}
};
var populateLayers = function(){
var layerlist = $('#layerlist tbody');
@ -1333,13 +1352,20 @@ function svg_edit_setup() {
$('#layerlist tr:first').addClass("layersel");
}
// handle selection of layer
$('#layerlist td.layername').click(function(evt){
$('#layerlist tr.layer').removeClass("layersel");
var row = $(this.parentNode);
row.addClass("layersel");
svgCanvas.setCurrentLayer(this.textContent);
evt.preventDefault();
});
$('#layerlist td.layername')
.click(function(evt){
$('#layerlist tr.layer').removeClass("layersel");
var row = $(this.parentNode);
row.addClass("layersel");
svgCanvas.setCurrentLayer(this.textContent);
evt.preventDefault();
})
.mouseover(function(evt){
toggleHighlightLayer(this.textContent);
})
.mouseout(function(evt){
toggleHighlightLayer();
});
$('#layerlist td.layervis').click(function(evt){
var row = $(this.parentNode).prevAll().length;
var name = $('#layerlist tr.layer:eq(' + row + ') td.layername').text();

View File

@ -3406,6 +3406,51 @@ function BatchCommand(text) {
var getLayerName = function(g) {
return $("title",g).text();
};
// Function: getLayerOpacity
// Returns the opacity of the given layer. If the input name is not a layer, null is returned.
//
// Parameters:
// layername - name of the layer on which to get the opacity
//
// Returns:
// The opacity value of the given layer. This will be a value between 0.0 and 1.0, or null
// if layername is not a valid layer
this.getLayerOpacity = function(layername) {
for (var i = 0; i < all_layers.length; ++i) {
if (all_layers[i][0] == layername) {
var g = all_layers[i][1];
var opacity = g.getAttribute("opacity");
if (!opacity) {
opacity = "1.0";
}
return parseFloat(opacity);
}
}
return null;
};
// Function: setLayerOpacity
// Sets the opacity of the given layer. If the input name is not a layer, nothing happens.
// This is not an undo-able action. NOTE: this function exists solely to apply
// a highlighting/de-emphasis effect to a layer, when it is possible for a user to affect
// the opacity of a layer, we will need to allow this function to produce an undo-able action.
// If opacity is not a value between 0.0 and 1.0, then nothing happens.
//
// Parameters:
// layername - name of the layer on which to set the opacity
// opacity - a float value in the range 0.0-1.0
this.setLayerOpacity = function(layername, opacity) {
if (opacity < 0.0 || opacity > 1.0) return;
for (var i = 0; i < all_layers.length; ++i) {
if (all_layers[i][0] == layername) {
var g = all_layers[i][1];
g.setAttribute("opacity", opacity);
break;
}
}
};
// Function: clear
// Clears the current document. This is not an undoable action.