Fix Issue 53: invalid values shown for fill/stroke opacity

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@289 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Jeff Schiller 2009-07-09 04:34:48 +00:00
parent 3f9ba9e5cd
commit 5774490082
2 changed files with 26 additions and 8 deletions

View File

@ -2,14 +2,17 @@
<html> <html>
<head> <head>
<link rel="stylesheet" href="jpicker/jpicker.css" type="text/css"/> <link rel="stylesheet" href="jpicker/jpicker.css" type="text/css"/>
<link rel="stylesheet" href="svg-editor.css" type="text/css"/> <link rel="stylesheet" href="svg-editor.min.css" type="text/css"/>
<link rel="stylesheet" href="spinbtn/JQuerySpinBtn.css" type="text/css"/> <link rel="stylesheet" href="spinbtn/JQuerySpinBtn.min.css" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="js-hotkeys/jquery.hotkeys.min.js"></script> <script type="text/javascript" src="js-hotkeys/jquery.hotkeys.min.js"></script>
<script type="text/javascript" src="jpicker/jpicker.js"></script> <script type="text/javascript" src="jpicker/jpicker.js"></script>
<script type="text/javascript" src="spinbtn/JQuerySpinBtn.js"></script> <script type="text/javascript" src="spinbtn/JQuerySpinBtn.js"></script>
<!--script type="text/javascript" src="spinbtn/JQuerySpinBtn.min.js"></script-->
<script type="text/javascript" src="svgcanvas.js"></script> <script type="text/javascript" src="svgcanvas.js"></script>
<!--script type="text/javascript" src="svgcanvas.min.js"></script-->
<script type="text/javascript" src="svg-editor.js"></script> <script type="text/javascript" src="svg-editor.js"></script>
<!--script type="text/javascript" src="svg-editor.min.js"></script-->
<title>SVG-edit demo</title> <title>SVG-edit demo</title>
</head> </head>
<body> <body>

View File

@ -63,11 +63,25 @@ function svg_edit_setup() {
// updates the toolbar (colors, opacity, etc) based on the selected element // updates the toolbar (colors, opacity, etc) based on the selected element
function updateToolbar() { function updateToolbar() {
if (selectedElement != null) { if (selectedElement != null) {
// get opacity values
var fillOpacity = parseFloat(selectedElement.getAttribute("fill-opacity"));
if (isNaN(fillOpacity)) {
fillOpacity = 1.0;
}
fillOpacity = (fillOpacity*100)+" %";
var strokeOpacity = parseFloat(selectedElement.getAttribute("stroke-opacity"));
if (isNaN(strokeOpacity)) {
strokeOpacity = 1.0;
}
strokeOpacity = (strokeOpacity*100)+" %";
// update fill color // update fill color
var fillColor = selectedElement.getAttribute("fill"); var fillColor = selectedElement.getAttribute("fill");
svgCanvas.setFillColor(fillColor); svgCanvas.setFillColor(fillColor);
if (fillColor == "none") { if (fillColor == "none") {
fillColor = 'url(\'images/none.png\')'; fillColor = 'url(\'images/none.png\')';
fillOpacity = "N/A";
} }
$('#fill_color').css('background', fillColor); $('#fill_color').css('background', fillColor);
@ -76,11 +90,12 @@ function svg_edit_setup() {
svgCanvas.setStrokeColor(strokeColor); svgCanvas.setStrokeColor(strokeColor);
if (strokeColor == null || strokeColor == "" || strokeColor == "none") { if (strokeColor == null || strokeColor == "" || strokeColor == "none") {
strokeColor = 'url(\'images/none.png\')'; strokeColor = 'url(\'images/none.png\')';
strokeOpacity = "N/A";
} }
$('#stroke_color').css('background', strokeColor); $('#stroke_color').css('background', strokeColor);
$('#fill_opacity').html(((selectedElement.getAttribute("fill-opacity")||1.0)*100)+" %"); $('#fill_opacity').html(fillOpacity);
$('#stroke_opacity').html(((selectedElement.getAttribute("stroke-opacity")||1.0)*100)+" %"); $('#stroke_opacity').html(strokeOpacity);
$('#group_opacity').val(((selectedElement.getAttribute("opacity")||1.0)*100)+" %"); $('#group_opacity').val(((selectedElement.getAttribute("opacity")||1.0)*100)+" %");
$('#stroke_width').val(selectedElement.getAttribute("stroke-width")||1); $('#stroke_width').val(selectedElement.getAttribute("stroke-width")||1);
$('#stroke_style').val(selectedElement.getAttribute("stroke-dasharray")||"none"); $('#stroke_style').val(selectedElement.getAttribute("stroke-dasharray")||"none");
@ -239,13 +254,13 @@ function svg_edit_setup() {
if (evt.shiftKey) { if (evt.shiftKey) {
svgCanvas.setStrokeColor(color); svgCanvas.setStrokeColor(color);
if (color != 'none' && $("#stroke_opacity").html() == 'N/A') { if (color != 'none' && $("#stroke_opacity").html() == 'N/A') {
svgCanvas.setStrokeOpacity(100); svgCanvas.setStrokeOpacity(1.0);
$("#stroke_opacity").html("100 %"); $("#stroke_opacity").html("100 %");
} }
} else { } else {
svgCanvas.setFillColor(color); svgCanvas.setFillColor(color);
if (color != 'none' && $("#fill_opacity").html() == 'N/A') { if (color != 'none' && $("#fill_opacity").html() == 'N/A') {
svgCanvas.setFillOpacity(100); svgCanvas.setFillOpacity(1.0);
$("#fill_opacity").html("100 %"); $("#fill_opacity").html("100 %");
} }
} }