Added basic implementation of issue 313 (logo becomes main menu button)
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1202 eee81c28-f429-11dd-99c0-75d572ba1dddmaster
Alexis Deveria
parent
faa165eb9d
commit
8a96643f1a
|
|
@ -232,22 +232,91 @@
|
|||
float: left;
|
||||
}
|
||||
|
||||
#svg_editor #logo {
|
||||
#svg_editor #main_button {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: 4px;
|
||||
padding: 0px;
|
||||
width: 44px;
|
||||
height: 30px;
|
||||
border-radius: 8px;
|
||||
-moz-border-radius: 8px;
|
||||
-webkit-border-radius: 8px;
|
||||
}
|
||||
|
||||
#svg_editor #logo a img {
|
||||
#svg_editor #main_button:hover {
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
padding: 1px 0 2px 1px;
|
||||
border-left: 1px #fcd9ba solid;
|
||||
border-top: 1px #fcd9ba solid;
|
||||
border-right: 1px #e0a874 solid;
|
||||
border-bottom: 1px #e0a874 solid;
|
||||
background-color: #FFC;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu {
|
||||
/* position: */
|
||||
z-index: 1;
|
||||
background: #E8E8E8;
|
||||
position: relative;
|
||||
width: 200px;
|
||||
padding: 5px;
|
||||
-moz-box-shadow: #555 1px 1px 4px;
|
||||
-webkit-box-shadow: #555 1px 1px 4px;
|
||||
font-size: 1.1em;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu ul,
|
||||
#svg_editor #main_menu li {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu li {
|
||||
/* height: 35px;*/
|
||||
line-height: 22px;
|
||||
padding-top: 2px;
|
||||
padding-left: 2px;
|
||||
overflow: auto;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu li:hover {
|
||||
background: #FFC;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu li > div {
|
||||
float: left;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
#svg_editor #main_menu p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
#svg_editor #logo img {
|
||||
border: 0;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
#main_button > div {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#svg_editor #main_button .dropdown {
|
||||
padding-top: 10px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#svg_editor #tools_top {
|
||||
position: absolute;
|
||||
left: 38px;
|
||||
left: 50px;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
height: 72px;
|
||||
|
|
@ -442,51 +511,18 @@ span.zoom_tool {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
div.fileinputs {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
div.fakefile {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
div.fileinputs svg {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
}
|
||||
*/
|
||||
|
||||
/* the file input control is placed on top but made invisible */
|
||||
/* TODO: is moz-opacity really needed? filter? */
|
||||
/*
|
||||
input.file {
|
||||
position: relative;
|
||||
text-align: right;
|
||||
-moz-opacity: 0;
|
||||
filter:alpha(opacity: 0);
|
||||
opacity: 0;
|
||||
}
|
||||
*/
|
||||
|
||||
#fileinputs {
|
||||
#svg_editor #main_menu li#tool_open {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#fileinputs input {
|
||||
-moz-transform: scale(2.0); /* Not entirely necessary, but keeps it nice and big for OS X*/
|
||||
#tool_open input {
|
||||
-moz-transform: scale(4,2); /* Not entirely necessary, but keeps it nice and big for OS X*/
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
top: -3px;
|
||||
right: 10px;
|
||||
right: 270px;
|
||||
margin: 0;
|
||||
cursor: pointer; /* Sadly doesn't appear to have an effect */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -74,23 +74,51 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
|
|||
<div id="sidepanel_handle" onselectstart="return false;" title="Drag left/right to resize side panel [X]">L a y e r s</div>
|
||||
</div>
|
||||
|
||||
<div id="logo">
|
||||
<a href="http://svg-edit.googlecode.com/" target="_blank" title="SVG-edit Home Page">
|
||||
</a>
|
||||
<div id="main_button" title="Main Menu">
|
||||
<div id="logo"></div>
|
||||
<div class="dropdown"></div>
|
||||
|
||||
<div id="main_menu">
|
||||
|
||||
<!-- File-like buttons: New, Save, Source -->
|
||||
<ul>
|
||||
<li id="tool_clear">
|
||||
<div></div>
|
||||
New Image [N]
|
||||
</li>
|
||||
|
||||
<li id="tool_open" style="display:none;">
|
||||
<div id="fileinputs">
|
||||
<div></div>
|
||||
</div>
|
||||
Open Image [O]
|
||||
</li>
|
||||
|
||||
<li id="tool_save">
|
||||
<div></div>
|
||||
Save Image [S]
|
||||
</li>
|
||||
|
||||
<li id="tool_docprops">
|
||||
<div></div>
|
||||
Document Properties [I]
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
<a href="http://svg-edit.googlecode.com/" target="_blank">
|
||||
SVG-edit Home Page
|
||||
</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div id="tools_top" class="tools_panel">
|
||||
|
||||
<!-- File-like buttons: New, Save, Source -->
|
||||
<div id="file_panel">
|
||||
<div class="push_button" id="tool_clear" title="New Image [N]"></div>
|
||||
|
||||
<div id="fileinputs" class="push_button">
|
||||
<div id="tool_open" title="Open Image [O]" ></div>
|
||||
</div>
|
||||
|
||||
<div class="push_button" id="tool_save" title="Save Image [S]"></div>
|
||||
<div class="push_button" id="tool_docprops" title="Document Properties [I]"></div>
|
||||
<div id="editor_panel">
|
||||
<div class="push_button" id="tool_source" title="Edit Source [U]"></div>
|
||||
<div class="tool_button" id="tool_wireframe" title="Wireframe Mode [F]"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -723,6 +723,34 @@ function svg_edit_setup() {
|
|||
return true;
|
||||
};
|
||||
|
||||
(function() {
|
||||
var button = $('#main_button');
|
||||
var list = $('#main_menu');
|
||||
var on_button = false;
|
||||
$().mouseup(function(evt) {
|
||||
if(!on_button) {
|
||||
button.removeClass('down');
|
||||
list.hide();
|
||||
}
|
||||
on_button = false;
|
||||
});
|
||||
|
||||
button.bind('mousedown',function() {
|
||||
if (!button.hasClass('down')) {
|
||||
button.addClass('down');
|
||||
list.show();
|
||||
on_button = true;
|
||||
} else {
|
||||
button.removeClass('down');
|
||||
// list.hide();
|
||||
}
|
||||
}).hover(function() {
|
||||
on_button = true;
|
||||
}).mouseout(function() {
|
||||
on_button = false;
|
||||
});
|
||||
}());
|
||||
|
||||
var addDropDown = function(elem, callback, dropUp) {
|
||||
var button = $(elem).find('button');
|
||||
var list = $(elem).find('ul');
|
||||
|
|
@ -1220,7 +1248,7 @@ function svg_edit_setup() {
|
|||
|
||||
$.resizeSvgIcons({
|
||||
'.flyout_arrow_horiz svg, .flyout_arrow_horiz img': size_num / 3,
|
||||
'#logo a > svg, #logo a > img': size_num * 1.3
|
||||
'#logo > svg, #logo > img': size_num * 1.3
|
||||
});
|
||||
if(size != 's') {
|
||||
$.resizeSvgIcons({'#layerbuttons svg, #layerbuttons img': size_num * .6});
|
||||
|
|
@ -1243,7 +1271,7 @@ function svg_edit_setup() {
|
|||
'margin': {s: '2px 2px', l: '2px 5px', xl: '2px 8px'}
|
||||
},
|
||||
"#tools_top": {
|
||||
'left': {s: '27px', l: '50px', xl: '70px'},
|
||||
'left': {s: '35px', l: '50px', xl: '70px'},
|
||||
'height': {s: '50px', l: '88px', xl: '125px'}
|
||||
},
|
||||
"#tools_left": {
|
||||
|
|
@ -2047,15 +2075,15 @@ function svg_edit_setup() {
|
|||
{sel:'#tool_text', fn: clickText, evt: 'click', key: 7},
|
||||
{sel:'#tool_image', fn: clickImage, evt: 'mouseup', key: 8},
|
||||
{sel:'#tool_zoom', fn: clickZoom, evt: 'mouseup', key: 9},
|
||||
{sel:'#tool_clear', fn: clickClear, evt: 'click', key: [modKey+'N', true]},
|
||||
{sel:'#tool_save', fn: function() { editingsource?saveSourceEditor():clickSave()}, evt: 'click', key: [modKey+'S', true]},
|
||||
{sel:'#tool_open', fn: clickOpen, evt: 'click', key: [modKey+'O', true]},
|
||||
{sel:'#tool_clear', fn: clickClear, evt: 'mouseup', key: [modKey+'N', true]},
|
||||
{sel:'#tool_save', fn: function() { editingsource?saveSourceEditor():clickSave()}, evt: 'mouseup', key: [modKey+'S', true]},
|
||||
{sel:'#tool_open', fn: clickOpen, evt: 'mouseup', key: [modKey+'O', true]},
|
||||
{sel:'#tool_source', fn: showSourceEditor, evt: 'click', key: ['U', true]},
|
||||
{sel:'#tool_wireframe', fn: clickWireframe, evt: 'click', key: ['F', true]},
|
||||
{sel:'#tool_source_cancel,#svg_source_overlay,#tool_docprops_cancel', fn: cancelOverlays, evt: 'click', key: ['esc', false, false], hidekey: true},
|
||||
{sel:'#tool_source_save', fn: saveSourceEditor, evt: 'click'},
|
||||
{sel:'#tool_docprops_save', fn: saveDocProperties, evt: 'click'},
|
||||
{sel:'#tool_docprops', fn: showDocProperties, evt: 'click', key: [modKey+'I', true]},
|
||||
{sel:'#tool_docprops', fn: showDocProperties, evt: 'mouseup', key: [modKey+'I', true]},
|
||||
{sel:'#tool_delete,#tool_delete_multi', fn: deleteSelected, evt: 'click', key: ['del/backspace', true]},
|
||||
{sel:'#tool_reorient', fn: reorientPath, evt: 'click'},
|
||||
{sel:'#tool_node_link', fn: linkControlPoints, evt: 'click'},
|
||||
|
|
@ -2228,7 +2256,7 @@ function svg_edit_setup() {
|
|||
reader.readAsText(this.files[0]);
|
||||
}
|
||||
});
|
||||
$("#fileinputs").show().prepend(inp);
|
||||
$("#tool_open").show().prepend(inp);
|
||||
|
||||
// This doesn't appear to be necessary...
|
||||
svgCanvas.setCustomHandlers( {open: fileOpen} );
|
||||
|
|
@ -2303,13 +2331,13 @@ function svg_edit_setup() {
|
|||
'arrow_down':'dropdown.gif'
|
||||
},
|
||||
placement: {
|
||||
'#logo a':'logo',
|
||||
'#logo':'logo',
|
||||
|
||||
'#tool_clear,#layer_new':'new_image',
|
||||
'#tool_save':'save',
|
||||
'#tool_open':'open',
|
||||
'#tool_clear div,#layer_new':'new_image',
|
||||
'#tool_save div':'save',
|
||||
'#tool_open div div':'open',
|
||||
'#tool_source':'source',
|
||||
'#tool_docprops':'docprops',
|
||||
'#tool_docprops > div':'docprops',
|
||||
'#tool_wireframe':'wireframe',
|
||||
|
||||
'#tool_undo':'undo',
|
||||
|
|
@ -2356,14 +2384,15 @@ function svg_edit_setup() {
|
|||
'#tool_source_cancel,#tool_docprops_cancel':'cancel',
|
||||
|
||||
'.flyout_arrow_horiz':'arrow_right',
|
||||
'.dropdown button':'arrow_down',
|
||||
'.dropdown button, #main_button .dropdown':'arrow_down',
|
||||
'#palette .palette_item:first, #fill_bg, #stroke_bg':'no_color'
|
||||
},
|
||||
resize: {
|
||||
'#logo a .svg_icon': 32,
|
||||
'#logo .svg_icon': 32,
|
||||
'.flyout_arrow_horiz .svg_icon': 5,
|
||||
'.layer_button .svg_icon, #layerlist td.layervis .svg_icon': 14,
|
||||
'.dropdown button .svg_icon': 7,
|
||||
'#main_button .dropdown .svg_icon': 9,
|
||||
'.palette_item:first .svg_icon, #fill_bg .svg_icon, #stroke_bg .svg_icon': 16,
|
||||
'.toolbar_button button .svg_icon':16
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue