+ Fixed the implementation of closing

+ Cleaned up the CSS styles by using background images
This commit is contained in:
Aza Raskin 2010-04-10 02:16:02 -07:00
parent a9aa8e9e59
commit 9af26a4f2f
3 changed files with 19 additions and 12 deletions

View File

@ -399,19 +399,19 @@ window.Group.prototype = $.extend(new Item(), new Subscribable(), {
}
}
var padAmount = .1;
var padAmount = .15;
var pad = padAmount * (best.w/best.numCols);
var tabW = (best.w-pad)/best.numCols - pad;
var tabH = (best.h-pad)/best.numRows - pad;
var x = pad; var y=pad; var numInCol = 0;
var x = pad*2; var y=pad; var numInCol = 0;
for each(var item in this._children){
item.setBounds(new Rect(x + bb.left, y + bb.top, tabW, tabH), !animate);
x += tabW + pad;
numInCol += 1;
if( numInCol >= best.numCols )
[x, numInCol, y] = [pad, 0, y+tabH+pad];
[x, numInCol, y] = [pad*2, 0, y+tabH+pad];
}
},

View File

@ -96,7 +96,7 @@ window.TabItems = {
self.lastMouseDownTarget = null;
if(!same)
return;
if(e.target.className == "close") {
$(this).find("canvas").data("link").tab.close(); }
else {
@ -146,8 +146,8 @@ window.TabItems = {
}
});
$("<div class='close'><img src='img/closetab.png'/></div>").appendTo($div);
$("<div class='expander'><img src='img/expand.png'/></div>").appendTo($div);
$("<div class='close'></div>").appendTo($div);
$("<div class='expander'></div>").appendTo($div);
function onNewTab(){
var p = Page.findOpenSpaceFor($div); // TODO shouldn't know about Page
@ -159,7 +159,7 @@ window.TabItems = {
$div.each(function() {
var tab = Tabs.tab(this);
$(this).data('tabItem', new TabItem(this, tab));
$(this).data('tabItem', new TabItem(this, tab));
});
// TODO: Figure out this really weird bug?

View File

@ -79,18 +79,25 @@ body {
position: absolute;
top: 6px;
right: 6px;
width: 16px;
height: 16px;
background: url(../img/closetab.png) no-repeat;
opacity: 0.2;
}
.close:hover{ opacity: 1.0;}
.expander {
position: absolute;
bottom: 3px;
bottom: 6px;
right: 6px;
width: 16px;
height: 16px;
background: url(../img/expand.png) no-repeat;
opacity: 0.2;
}
.close img, .expander img{
opacity: 0.2;
border: none;
}
.expander:hover{opacity:1.0;}
.favicon img:hover, .close img:hover, .expander img:hover{
opacity: 1;