Make the layer handle draggable.

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@798 eee81c28-f429-11dd-99c0-75d572ba1ddd
This commit is contained in:
Jeff Schiller
2009-10-11 06:07:57 +00:00
parent b1393df28c
commit 4a2141fd8a
4 changed files with 33 additions and 6 deletions

View File

@@ -116,5 +116,5 @@
{"id":"tool_node_delete","title":"Delete Node"},
{"id":"selLayerLabel","textContent":"Move elements to:"},
{"id":"selLayerNames","title":"Move selected elements to a different layer"},
{"id":"sidepanel_handle","title":"Drag left/right to resize Layer panel","textContent":"L a y e r s"}
{"id":"sidepanel_handle","title":"Drag left/right to resize side panel","textContent":"L a y e r s"}
];

View File

@@ -63,7 +63,7 @@ body {
top: 75px;
left: 40px;
bottom: 60px;
right: 155px;
right: 149px;
background-color: #A0A0A0;
border: 1px solid #808080;
overflow: auto;
@@ -75,7 +75,7 @@ body {
top: 75px;
bottom: 60px;
right: 0px;
width: 136px;
width: 130px;
padding: 12px;
border-color: #808080;
border-style: solid;
@@ -87,10 +87,10 @@ body {
display: inline-block;
background-color: #E8E8E8;
position:absolute;
top: 0px;
top: 1px;
bottom: 0px;
right: 0px;
width: 126px;
width: 120px;
overflow-y: scroll;
padding-left: 12px;
padding-right: 12px;
@@ -195,6 +195,10 @@ body {
font-weight: bold;
}
#svg_editor #selLayerLabel {
white-space: nowrap;
}
#svg_editor #selLayerNames {
display: block;
}

View File

@@ -71,7 +71,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
<option selected="selected" value="layer1">Layer 1</option>
</select>
</div>
<div id="sidepanel_handle" onselectstart="return false;" title="Drag left/right to resize Layer panel">L a y e r s</div>
<div id="sidepanel_handle" onselectstart="return false;" title="Drag left/right to resize side panel">L a y e r s</div>
</div>
<div id="logo">

View File

@@ -1240,6 +1240,29 @@ function svg_edit_setup() {
$('#layerlist tr.layer:eq('+curIndex+')').addClass("layersel");
});
var sidedrag = -1;
$('#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;})
.mousemove(function(evt) {
if (sidedrag == -1) return;
var deltax = sidedrag - evt.pageX;
if (deltax == 0) return;
sidedrag = evt.pageX;
var sidewidth = parseInt($('#sidepanels').css('width'))+deltax;
if (sidewidth <= 156 && sidewidth >= 10) {
var workarea = $('#workarea');
var sidepanels = $('#sidepanels');
var layerpanel = $('#layerpanel');
workarea.css('right', parseInt(workarea.css('right'))+deltax);
sidepanels.css('width', parseInt(sidepanels.css('width'))+deltax);
layerpanel.css('width', parseInt(layerpanel.css('width'))+deltax);
}
});
var populateLayers = function(){
var layerlist = $('#layerlist tbody');
var selLayerNames = $('#selLayerNames');