Fixed issue 764: Small window size may cause the UI to be drawn over the drawing area

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1956 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Alexis Deveria 2011-01-31 15:57:01 +00:00
parent 212e5b1795
commit 201d284071
3 changed files with 22 additions and 10 deletions

View File

@ -485,9 +485,7 @@
top: 2px; top: 2px;
height: 72px; height: 72px;
border-bottom: none; border-bottom: none;
/* Ideally this should be auto (makes scrollbar if needed), but currently hides overflow: auto;
the .dropdown lists.
/* overflow: auto;*/
} }
#svg_editor #tools_left { #svg_editor #tools_left {
@ -671,7 +669,7 @@ span.zoom_tool {
background: #FFC; background: #FFC;
} }
#font_family_dropdown li { #font_family_dropdown-list li {
font-size: 1.4em; font-size: 1.4em;
} }
@ -914,7 +912,7 @@ span.zoom_tool {
#tools_top .dropdown .icon_label { #tools_top .dropdown .icon_label {
border: 1px solid transparent; border: 1px solid transparent;
margin-top: 3px; /* margin-top: 3px;*/
height: auto; height: auto;
} }

View File

@ -567,7 +567,7 @@
<div id="copyright"><span id="copyrightLabel">Powered by</span> <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.6-alpha</a></div> <div id="copyright"><span id="copyrightLabel">Powered by</span> <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.6-alpha</a></div>
</div> </div>
<div id="option_lists"> <div id="option_lists" class="dropdown">
<ul id="linejoin_opts"> <ul id="linejoin_opts">
<li class="tool_button current" id="linejoin_miter" title="Linejoin: Miter"></li> <li class="tool_button current" id="linejoin_miter" title="Linejoin: Miter"></li>
<li class="tool_button" id="linejoin_round" title="Linejoin: Round"></li> <li class="tool_button" id="linejoin_round" title="Linejoin: Round"></li>

View File

@ -2130,13 +2130,19 @@
// TODO: Group UI functions into a public svgEditor.ui interface. // TODO: Group UI functions into a public svgEditor.ui interface.
Editor.addDropDown = function(elem, callback, dropUp) { Editor.addDropDown = function(elem, callback, dropUp) {
var button = $(elem).find('button'); var button = $(elem).find('button');
var list = $(elem).find('ul'); var list = $(elem).find('ul').attr('id', $(elem)[0].id + '-list');
if(!dropUp) {
// Move list to place where it can overflow container
$('#option_lists').append(list);
}
var on_button = false; var on_button = false;
if(dropUp) { if(dropUp) {
$(elem).addClass('dropup'); $(elem).addClass('dropup');
} }
$(elem).find('li').bind('mouseup', callback); list.find('li').bind('mouseup', callback);
$(window).mouseup(function(evt) { $(window).mouseup(function(evt) {
if(!on_button) { if(!on_button) {
@ -2149,7 +2155,16 @@
button.bind('mousedown',function() { button.bind('mousedown',function() {
if (!button.hasClass('down')) { if (!button.hasClass('down')) {
button.addClass('down'); button.addClass('down');
if(!dropUp) {
var pos = $(elem).position();
list.css({
top: pos.top + 24,
left: pos.left - 10
});
}
list.show(); list.show();
on_button = true; on_button = true;
} else { } else {
button.removeClass('down'); button.removeClass('down');
@ -2249,8 +2264,7 @@
} }
}); });
Editor.addDropDown('#blur_dropdown', function() { Editor.addDropDown('#blur_dropdown', $.noop);
});
var slideStart = false; var slideStart = false;