From 6f50b1fdc4ccfedf26808462677da1eae11bc8f6 Mon Sep 17 00:00:00 2001 From: Alexis Deveria Date: Tue, 6 Apr 2010 15:53:21 +0000 Subject: [PATCH] Converted linejoin options to icons git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1505 eee81c28-f429-11dd-99c0-75d572ba1ddd --- editor/images/svg_edit_icons.svg | 54 ++++++++++++++++++++++++++++++++ editor/svg-editor.css | 15 ++++----- editor/svg-editor.html | 50 +++++++++++++---------------- editor/svg-editor.js | 18 +++++++++-- 4 files changed, 99 insertions(+), 38 deletions(-) diff --git a/editor/images/svg_edit_icons.svg b/editor/images/svg_edit_icons.svg index 91e72aef..f1f8cc77 100644 --- a/editor/images/svg_edit_icons.svg +++ b/editor/images/svg_edit_icons.svg @@ -738,6 +738,60 @@ + + + + + + + + + + + + + Layer 1 + + + + + + + + + + + + + + + + + + Layer 1 + + + + + + + + + + + + + + + + + + Layer 1 + + + + + diff --git a/editor/svg-editor.css b/editor/svg-editor.css index 354d99d7..2e158dae 100644 --- a/editor/svg-editor.css +++ b/editor/svg-editor.css @@ -631,6 +631,7 @@ span.zoom_tool { display: none; background: #E8E8E8; height: 350px; + z-index: 4; } #svg_editor .tools_flyout { @@ -720,7 +721,7 @@ span.zoom_tool { background: #F0F0F0; } -#svg_editor #cur_linecap { +#svg_editor .stroke_tool div div { -moz-user-select: none; width: 20px; height: 20px; @@ -729,25 +730,25 @@ span.zoom_tool { border: 1px solid #DDD; } -#svg_editor #cur_linecap:hover { +#svg_editor .stroke_tool:hover div > * { background-color: #FFC; } -#svg_editor .stroke_tool.down #cur_linecap, +#svg_editor .stroke_tool.down div div, #svg_editor .stroke_tool.down button { border: 1px inset gray; background: #F4E284; } -#stroke_linecap > div { +.stroke_tool > div { width: 42px; } -#stroke_linecap > div > * { +.stroke_tool > div > * { float: left; } -ul#linecap_opts { +#option_lists ul { display: none; position: absolute; height: 90px; @@ -761,7 +762,7 @@ ul#linecap_opts { background-color: #F4E284; } -#svg_editor ul#linecap_opts li { +#svg_editor #option_lists ul li { margin: 0; border-radius: 0; -moz-border-radius: 0; diff --git a/editor/svg-editor.html b/editor/svg-editor.html index ed6fb8f9..081fbe03 100644 --- a/editor/svg-editor.html +++ b/editor/svg-editor.html @@ -440,27 +440,14 @@ script type="text/javascript" src="locale/locale.min.js"> - - - Join: - - - - + + + @@ -505,11 +489,19 @@ script type="text/javascript" src="locale/locale.min.js"> - +
+
    +
  • +
  • +
  • +
+ +
    +
  • +
  • +
  • +
+
diff --git a/editor/svg-editor.js b/editor/svg-editor.js index f1525820..1c5a63ff 100644 --- a/editor/svg-editor.js +++ b/editor/svg-editor.js @@ -314,6 +314,10 @@ '#linecap_round':'linecap_round', '#linecap_square':'linecap_square', + '#linejoin_miter,#cur_linejoin':'linejoin_miter', + '#linejoin_round':'linejoin_round', + '#linejoin_bevel':'linejoin_bevel', + '#url_notice':'warning', '#layer_up':'go_up', @@ -1020,8 +1024,9 @@ $('#stroke_width').val(selectedElement.getAttribute("stroke-width")||1); $('#stroke_style').val(selectedElement.getAttribute("stroke-dasharray")||"none"); - $('#stroke_linejoin').val(selectedElement.getAttribute("stroke-linejoin")||"miter"); -// $('#stroke_linecap').val(selectedElement.getAttribute("stroke-linecap")||"butt"); + + var attr = selectedElement.getAttribute("stroke-linejoin") || 'miter'; + $('#linejoin_' + attr).mouseup(); var attr = selectedElement.getAttribute("stroke-linecap") || 'butt'; $('#linecap_' + attr).mouseup(); @@ -1689,6 +1694,15 @@ $.resizeSvgIcons({'#cur_linecap .svg_icon': 20}); }, true); + addAltDropDown('#stroke_linejoin', '#linejoin_opts', function() { + var val = this.id.split('_')[1]; + svgCanvas.setStrokeAttr('stroke-linejoin', val); + operaRepaint(); + var icon = $.getSvgIcon(this.id).clone(); + $('#cur_linejoin').empty().append(icon); + $.resizeSvgIcons({'#cur_linejoin .svg_icon': 20}); + }, true); + /* When a flyout icon is selected