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-75d572ba1dddmaster
parent
ca67ea8af2
commit
8ce44e7755
|
@ -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();
|
||||
|
|
|
@ -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.
|
||||
|
|
Loading…
Reference in New Issue