mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-04-03 04:52:54 +00:00
Merge.
This commit is contained in:
aza@More-Better-Internet.local
commit
01fc3968c9
@ -1,5 +1,4 @@
|
||||
(function(){
|
||||
/* Utils.log('top of tab mirror file'); */
|
||||
|
||||
const Cc = Components.classes;
|
||||
const Ci = Components.interfaces;
|
||||
@ -11,49 +10,43 @@ function _isIframe(doc){
|
||||
return win.parent != win;
|
||||
}
|
||||
|
||||
|
||||
// ----------
|
||||
var TabCanvas = function(tab, canvas){ this.init(tab, canvas) }
|
||||
TabCanvas.prototype = {
|
||||
init: function(tab, canvas){
|
||||
this.tab = tab;
|
||||
this.canvas = canvas;
|
||||
this.window = window;
|
||||
|
||||
this.RATE_LIMIT = 250; // To refresh the thumbnail any faster than this. In ms.
|
||||
this.lastDraw = null;
|
||||
|
||||
|
||||
$(canvas).data("link", this);
|
||||
|
||||
var w = $(canvas).width();
|
||||
var h = $(canvas).height();
|
||||
$(canvas).attr({width:w, height:h});
|
||||
|
||||
this.paint(null);
|
||||
|
||||
|
||||
var self = this;
|
||||
var paintIt = function(evt){self.onPaint(evt) };
|
||||
|
||||
// Don't mirror chrome tabs.
|
||||
//if( window.location.protocol == "chrome:" ) return;
|
||||
|
||||
/* Utils.log('attaching', tab.contentWindow.location.href); */
|
||||
tab.contentWindow.addEventListener("MozAfterPaint", paintIt, false);
|
||||
|
||||
/*
|
||||
tab.contentDocument.addEventListener("onload", function() {
|
||||
Utils.log('onload', this.tab.contentWindow.location.href);
|
||||
}, false);
|
||||
*/
|
||||
|
||||
$(window).unload(function(){
|
||||
tab.contentWindow.removeEventListener("MozAfterPaint", paintIt, false);
|
||||
})
|
||||
this.paintIt = function(evt) {
|
||||
// note that "window" is unreliable in this context, so we'd use self.window if needed
|
||||
self.tab.mirror.triggerPaint();
|
||||
/* self.window.Utils.log('paint it', self.tab.url); */
|
||||
};
|
||||
},
|
||||
|
||||
attach: function() {
|
||||
this.tab.contentWindow.addEventListener("MozAfterPaint", this.paintIt, false);
|
||||
},
|
||||
|
||||
detach: function() {
|
||||
this.tab.contentWindow.removeEventListener("MozAfterPaint", this.paintIt, false);
|
||||
},
|
||||
|
||||
|
||||
paint: function(evt){
|
||||
var $ = this.window.$;
|
||||
if( $ == null ) return;
|
||||
if( $ == null ) {
|
||||
Utils.log('null $ in paint');
|
||||
return;
|
||||
}
|
||||
|
||||
var $canvas = $(this.canvas);
|
||||
var ctx = this.canvas.getContext("2d");
|
||||
|
||||
@ -61,36 +54,27 @@ TabCanvas.prototype = {
|
||||
var h = $canvas.height();
|
||||
|
||||
var fromWin = this.tab.contentWindow;
|
||||
if( fromWin == null || fromWin.location.protocol == "chrome:") return;
|
||||
/* Utils.trace('paint: ' + this.tab.url); */
|
||||
if(fromWin == null) {
|
||||
Utils.log('null fromWin in paint');
|
||||
return;
|
||||
}
|
||||
|
||||
Utils.assert('chrome windows don\'t get paint (TabCanvas.paint)',
|
||||
fromWin.location.protocol != "chrome:");
|
||||
|
||||
var scaler = w/fromWin.innerWidth;
|
||||
|
||||
// TODO: Potentially only redraw the dirty rect? (Is it worth it?)
|
||||
var now = new Date();
|
||||
if( this.lastDraw == null || now - this.lastDraw > this.RATE_LIMIT ){
|
||||
var startTime = new Date();
|
||||
ctx.save();
|
||||
ctx.scale(scaler, scaler);
|
||||
try{
|
||||
ctx.drawWindow( fromWin, fromWin.scrollX, fromWin.scrollY, w/scaler, h/scaler, "#fff" );
|
||||
} catch(e){
|
||||
|
||||
}
|
||||
|
||||
ctx.restore();
|
||||
var elapsed = (new Date()) - startTime;
|
||||
//Utils.log( this.window.location.host + " " + elapsed );
|
||||
this.lastDraw = new Date();
|
||||
|
||||
ctx.save();
|
||||
ctx.scale(scaler, scaler);
|
||||
try{
|
||||
ctx.drawWindow( fromWin, fromWin.scrollX, fromWin.scrollY, w/scaler, h/scaler, "#fff" );
|
||||
} catch(e){
|
||||
Utils.error('paint', e);
|
||||
}
|
||||
ctx.restore();
|
||||
},
|
||||
|
||||
onPaint: function(evt){
|
||||
/*
|
||||
if(this.tab.contentWindow == null || this.tab.contentWindow.location.protocol != 'chrome:')
|
||||
Utils.trace('on paint', this.tab.contentWindow.location.href);
|
||||
*/
|
||||
this.paint(evt);
|
||||
|
||||
ctx.restore();
|
||||
},
|
||||
|
||||
animate: function(options, duration){
|
||||
@ -119,31 +103,19 @@ TabCanvas.prototype = {
|
||||
}
|
||||
}
|
||||
|
||||
// ----------
|
||||
var TabMirror = function( ){ this.init() }
|
||||
TabMirror.prototype = {
|
||||
init: function(){
|
||||
/* Utils.log('creating tab mirror'); */
|
||||
var self = this;
|
||||
|
||||
/* Utils.log(Tabs); */
|
||||
|
||||
Tabs.onOpen(function(evt) {
|
||||
Utils.log('mirror onOpen', evt.tab.url);
|
||||
});
|
||||
|
||||
Tabs.onLoad(function(evt) {
|
||||
Utils.log('mirror onLoad', evt.tab.url);
|
||||
});
|
||||
|
||||
// When a tab is updated, update the mirror
|
||||
Tabs.onReady( function(evt){
|
||||
Utils.log('mirror onready');
|
||||
self.update(evt.tab);
|
||||
});
|
||||
|
||||
// When a tab is closed, unlink.
|
||||
Tabs.onClose( function(){
|
||||
Utils.log('mirror onclose');
|
||||
self.unlink(this);
|
||||
});
|
||||
|
||||
@ -151,86 +123,116 @@ TabMirror.prototype = {
|
||||
Tabs.forEach(function(tab){
|
||||
self.link(tab);
|
||||
});
|
||||
|
||||
|
||||
this.paintingPaused = 0;
|
||||
this.heartbeatIndex = 0;
|
||||
this._fireNextHeartbeat();
|
||||
},
|
||||
|
||||
_getEl: function(tab){
|
||||
mirror = null;
|
||||
$(".tab").each(function(){
|
||||
if( $(this).data("tab") == tab ){
|
||||
mirror = this;
|
||||
return;
|
||||
_heartbeat: function() {
|
||||
try {
|
||||
var now = Utils.getMilliseconds();
|
||||
var count = Tabs.length;
|
||||
if(count && this.paintingPaused <= 0) {
|
||||
this.heartbeatIndex++;
|
||||
if(this.heartbeatIndex >= count)
|
||||
this.heartbeatIndex = 0;
|
||||
|
||||
var tab = Tabs[this.heartbeatIndex];
|
||||
var mirror = tab.mirror;
|
||||
if(mirror) {
|
||||
var iconUrl = tab.raw.linkedBrowser.mIconURL;
|
||||
var label = tab.raw.label;
|
||||
$fav = $(mirror.favEl);
|
||||
$name = $(mirror.nameEl);
|
||||
|
||||
if(iconUrl != $fav.attr("src")) {
|
||||
$fav.attr("src", iconUrl);
|
||||
mirror.triggerPaint();
|
||||
}
|
||||
|
||||
if($name.text() != label) {
|
||||
$name.text(label);
|
||||
mirror.triggerPaint();
|
||||
}
|
||||
|
||||
if(tab.url != mirror.url) {
|
||||
mirror.url = tab.url;
|
||||
mirror.triggerPaint();
|
||||
}
|
||||
|
||||
if(mirror.needsPaint) {
|
||||
mirror.tabCanvas.paint();
|
||||
|
||||
if(Utils.getMilliseconds() - mirror.needsPaint > 5000)
|
||||
mirror.needsPaint = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
return mirror;
|
||||
} catch(e) {
|
||||
Utils.error('heartbeat', e);
|
||||
}
|
||||
|
||||
this._fireNextHeartbeat();
|
||||
},
|
||||
|
||||
_fireNextHeartbeat: function() {
|
||||
var self = this;
|
||||
window.setTimeout(function() {
|
||||
self._heartbeat();
|
||||
}, 100);
|
||||
},
|
||||
|
||||
_customize: function(func){
|
||||
// pass
|
||||
// This gets set by add-ons/extensions to MirrorTab
|
||||
},
|
||||
|
||||
_createEl: function(tab){
|
||||
/* Utils.trace('_createEl'); */
|
||||
var div = $("<div class='tab'><span class='name'> </span><img class='fav'/><canvas class='thumb'/></div>")
|
||||
.data("tab", tab)
|
||||
.appendTo("body");
|
||||
|
||||
if( tab.url.match("chrome:") ){
|
||||
if( tab.url.match("chrome:") )
|
||||
div.hide();
|
||||
}
|
||||
|
||||
this._customize(div);
|
||||
|
||||
function updateAttributes(){
|
||||
var iconUrl = tab.raw.linkedBrowser.mIconURL;
|
||||
var label = tab.raw.label;
|
||||
$fav = $('.fav', div)
|
||||
$name = $('.name', div);
|
||||
|
||||
if(iconUrl != $fav.attr("src")) $fav.attr("src", iconUrl);
|
||||
if( $name.text() != label ) {
|
||||
$name.text(label);
|
||||
/* Utils.trace('update', label); */
|
||||
}
|
||||
}
|
||||
|
||||
var timer = setInterval( updateAttributes, 500 );
|
||||
div.data("timer", timer);
|
||||
tab.mirror = {};
|
||||
tab.mirror.needsPaint = 0;
|
||||
tab.mirror.el = div.get(0);
|
||||
tab.mirror.favEl = $('.fav', div).get(0);
|
||||
tab.mirror.nameEl = $('.name', div).get(0);
|
||||
tab.mirror.canvasEl = $('.thumb', div).get(0);
|
||||
|
||||
this._updateEl(tab);
|
||||
},
|
||||
|
||||
_updateEl: function(tab){
|
||||
/* Utils.log('_udateEl', tab.url); */
|
||||
var el = this._getEl(tab);
|
||||
tab.mirror.triggerPaint = function() {
|
||||
var date = new Date();
|
||||
this.needsPaint = date.getTime();
|
||||
};
|
||||
|
||||
var canvas = $('.thumb', el).get(0);
|
||||
if(!$(canvas).data("link"))
|
||||
new TabCanvas(tab, canvas);
|
||||
},
|
||||
|
||||
update: function(tab){
|
||||
/* Utils.log('update'); */
|
||||
var doc = tab.contentDocument;
|
||||
this.link(tab);
|
||||
|
||||
if( !_isIframe(doc) ){
|
||||
this._updateEl(tab);
|
||||
if( !_isIframe(doc) ) {
|
||||
tab.mirror.tabCanvas = new TabCanvas(tab, tab.mirror.canvasEl);
|
||||
tab.mirror.tabCanvas.attach();
|
||||
tab.mirror.triggerPaint();
|
||||
}
|
||||
},
|
||||
|
||||
update: function(tab){
|
||||
this.link(tab);
|
||||
|
||||
if(tab.mirror && tab.mirror.tabCanvas)
|
||||
tab.mirror.triggerPaint();
|
||||
},
|
||||
|
||||
link: function(tab){
|
||||
/* Utils.trace('link'); */
|
||||
/* Utils.log('link: ' + tab.url); */
|
||||
// Don't add duplicates
|
||||
var dup = this._getEl(tab)
|
||||
if( dup ) return false;
|
||||
|
||||
/*// Don't do anything that starts with a chrome URL
|
||||
if( tab.contentWindow.location.protocol == "chrome:" ){
|
||||
if(tab.mirror)
|
||||
return false;
|
||||
|
||||
// Don't do anything that starts with a chrome URL
|
||||
if( tab.contentWindow.location.protocol == "chrome:" )
|
||||
return false;
|
||||
}*/
|
||||
|
||||
// Add the tab to the page
|
||||
this._createEl(tab);
|
||||
@ -238,26 +240,40 @@ TabMirror.prototype = {
|
||||
},
|
||||
|
||||
unlink: function(tab){
|
||||
$(".tab").each(function(){
|
||||
if( $(this).data("tab") == tab ){
|
||||
clearInterval( $(this).data("timer") );
|
||||
$(this).remove();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
var mirror = tab.mirror;
|
||||
if(mirror) {
|
||||
var tabCanvas = mirror.tabCanvas;
|
||||
if(tabCanvas)
|
||||
tabCanvas.detach();
|
||||
|
||||
$(mirror.el).remove();
|
||||
|
||||
tab.mirror = null;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
new TabMirror()
|
||||
window.TabMirror = {}
|
||||
window.TabMirror.customize = function(func){
|
||||
// Apply the custom handlers to all existing elements
|
||||
// TODO: Make this modular: so that it only exists in one place.
|
||||
// No breaking DRY!
|
||||
func($("div.tab"));
|
||||
// ----------
|
||||
window.TabMirror = {
|
||||
_private: new TabMirror(),
|
||||
|
||||
// Apply it to all future elements.
|
||||
TabMirror.prototype._customize = func;
|
||||
customize: function(func) {
|
||||
// Apply the custom handlers to all existing elements
|
||||
// TODO: Make this modular: so that it only exists in one place.
|
||||
// No breaking DRY!
|
||||
func($("div.tab"));
|
||||
|
||||
// Apply it to all future elements.
|
||||
TabMirror.prototype._customize = func;
|
||||
},
|
||||
|
||||
pausePainting: function() {
|
||||
this._private.paintingPaused++;
|
||||
},
|
||||
|
||||
resumePainting: function() {
|
||||
this._private.paintingPaused--;
|
||||
}
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
@ -115,12 +115,12 @@ var Utils = {
|
||||
consoleService.logStringMessage(text);
|
||||
},
|
||||
|
||||
error: function(text) { // pass as many arguments as you want, it'll print them all
|
||||
error: function() { // pass as many arguments as you want, it'll print them all
|
||||
var text = this.expandArgumentsForLog(arguments);
|
||||
Components.utils.reportError(text);
|
||||
Cu.reportError('tabcandy error: ' + text);
|
||||
},
|
||||
|
||||
trace: function(text) { // pass as many arguments as you want, it'll print them all
|
||||
trace: function() { // pass as many arguments as you want, it'll print them all
|
||||
var text = this.expandArgumentsForLog(arguments);
|
||||
if(typeof(printStackTrace) != 'function')
|
||||
this.log(text + ' trace: you need to include stacktrace.js');
|
||||
@ -130,7 +130,19 @@ var Utils = {
|
||||
this.log('trace: ' + text + '\n' + calls.join('\n'));
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
assert: function(label, condition) {
|
||||
if(!condition) {
|
||||
var text = 'tabcandy assert: ' + label;
|
||||
if(typeof(printStackTrace) == 'function') {
|
||||
var calls = printStackTrace();
|
||||
text += '\n' + calls[3];
|
||||
}
|
||||
|
||||
Cu.reportError(text);
|
||||
}
|
||||
},
|
||||
|
||||
expandObject: function(obj) {
|
||||
var s = obj + ' = {';
|
||||
for(prop in obj) {
|
||||
@ -177,6 +189,12 @@ var Utils = {
|
||||
return (event.button == 2);
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
// ___ Time
|
||||
getMilliseconds: function() {
|
||||
var date = new Date();
|
||||
return date.getTime();
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -20,6 +20,8 @@
|
||||
margin: 0px;
|
||||
padding: 0;
|
||||
background-color: rgba(255,255,255,.8);
|
||||
width: 160px;
|
||||
height: 138px;
|
||||
}
|
||||
|
||||
.fav{
|
||||
@ -43,6 +45,10 @@
|
||||
-moz-box-shadow: 1px 1px 10px rgba(0,0,0,.5);
|
||||
}
|
||||
|
||||
.thumb-selected {
|
||||
-moz-box-shadow: 1px 1px 10px rgba(0,0,0,1);
|
||||
}
|
||||
|
||||
.name{
|
||||
position: absolute;
|
||||
top: 123px;
|
||||
|
||||
@ -2,8 +2,14 @@ function Selector(options){ this.init(options) }
|
||||
Selector.prototype = {
|
||||
init: function(options){
|
||||
var self = this;
|
||||
options.onSelect = function(a,b){ self.showMenu(a,b); };
|
||||
options.onStart = function(){ self.hideMenu(250) };
|
||||
options.onSelect = function(a,b){
|
||||
self.showMenu(a,b);
|
||||
TabMirror.resumePainting();
|
||||
};
|
||||
options.onStart = function(){
|
||||
self.hideMenu(250);
|
||||
TabMirror.pausePainting();
|
||||
};
|
||||
/* options.onMove = function(a){ self.updateSelection(a) }; */
|
||||
options.acceptMouseDown = function(a){ return self.acceptMouseDown(a); };
|
||||
this.lasso = new Lasso(options);
|
||||
@ -31,6 +37,7 @@ Selector.prototype = {
|
||||
if(self.menu) {
|
||||
self.menu.remove();
|
||||
self.menu = null;
|
||||
self.clearSelection();
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -42,7 +49,8 @@ Selector.prototype = {
|
||||
if( pos == null || selectedEls.length == 0 ) return;
|
||||
var self = this;
|
||||
|
||||
this.updateSelection(selectedEls);
|
||||
this.selectedEls = selectedEls;
|
||||
this.updateSelection();
|
||||
this.cancelFadeOutTimer();
|
||||
|
||||
this.menu = $("<div class='lasso-menu'>").appendTo("body");
|
||||
@ -76,10 +84,17 @@ Selector.prototype = {
|
||||
});
|
||||
},
|
||||
|
||||
updateSelection: function(els) {
|
||||
for( var i=0; i<els.length; i++){
|
||||
var el = els[i];
|
||||
$(el).css("-moz-box-shadow", "1px 1px 10px rgba(0,0,0,.5)");
|
||||
updateSelection: function() {
|
||||
for( var i=0; i<this.selectedEls.length; i++){
|
||||
var el = this.selectedEls[i];
|
||||
$('.thumb', el).addClass('thumb-selected');
|
||||
}
|
||||
},
|
||||
|
||||
clearSelection: function() {
|
||||
for( var i=0; i<this.selectedEls.length; i++){
|
||||
var el = this.selectedEls[i];
|
||||
$('.thumb', el).removeClass('thumb-selected');
|
||||
}
|
||||
},
|
||||
|
||||
@ -99,7 +114,10 @@ function group(els){
|
||||
var el = els[i];
|
||||
var pos = startEl.position();
|
||||
$(el).css("z-index", i*10);
|
||||
$(el).animate({top: pos.top, left: pos.left, position: "absolute"}, 250);
|
||||
TabMirror.pausePainting();
|
||||
$(el).animate({top: pos.top, left: pos.left, position: "absolute"}, 500, null, function() {
|
||||
TabMirror.resumePainting();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -28,11 +28,15 @@ var Page = {
|
||||
function mod($div){
|
||||
/* Utils.log('creating a tab'); */
|
||||
$div.draggable({
|
||||
start:function(){ isDragging = true; },
|
||||
start:function(){
|
||||
isDragging = true;
|
||||
TabMirror.pausePainting();
|
||||
},
|
||||
stop: function(){
|
||||
isDragging = false;
|
||||
$(this).css({zIndex: zIndex});
|
||||
zIndex += 1;
|
||||
TabMirror.resumePainting();
|
||||
},
|
||||
zIndex: 999,
|
||||
}).mouseup(function(e){
|
||||
@ -48,8 +52,12 @@ var Page = {
|
||||
}
|
||||
});
|
||||
|
||||
$("<div class='close'>x</div>").appendTo($div)
|
||||
|
||||
$("<div class='close'>x</div>").appendTo($div);
|
||||
|
||||
if(Arrange.initialized) {
|
||||
var p = Page.findOpenSpaceFor($div);
|
||||
$div.css({left: p.x, top: p.y});
|
||||
}
|
||||
}
|
||||
|
||||
window.TabMirror.customize(mod);
|
||||
@ -119,6 +127,92 @@ var Page = {
|
||||
$(window).blur(function(){
|
||||
Navbar.show();
|
||||
})
|
||||
},
|
||||
|
||||
findOpenSpaceFor: function($div) {
|
||||
var w = window.innerWidth;
|
||||
var h = 0;
|
||||
var startX = 30;
|
||||
var startY = 100;
|
||||
var bufferX = 30;
|
||||
var bufferY = 30;
|
||||
var rects = [];
|
||||
var r;
|
||||
var $el;
|
||||
$(".tab:visible").each(function(i) {
|
||||
if(this == $div.get(0))
|
||||
return;
|
||||
|
||||
$el = $(this);
|
||||
r = {x: parseInt($el.css('left')),
|
||||
y: parseInt($el.css('top')),
|
||||
w: parseInt($el.css('width')) + bufferX,
|
||||
h: parseInt($el.css('height')) + bufferY};
|
||||
|
||||
if(r.x + r.w > w)
|
||||
w = r.x + r.w;
|
||||
|
||||
if(r.y + r.h > h)
|
||||
h = r.y + r.h;
|
||||
|
||||
rects.push(r);
|
||||
});
|
||||
|
||||
if(!h)
|
||||
return { 'x': startX, 'y': startY };
|
||||
|
||||
var canvas = document.createElement('canvas');
|
||||
$(canvas).attr({width:w,height:h});
|
||||
|
||||
var ctx = canvas.getContext('2d');
|
||||
ctx.fillStyle = 'rgb(255, 255, 255)';
|
||||
ctx.fillRect(0, 0, w, h);
|
||||
ctx.fillStyle = 'rgb(0, 0, 0)';
|
||||
var count = rects.length;
|
||||
var a;
|
||||
for(a = 0; a < count; a++) {
|
||||
r = rects[a];
|
||||
ctx.fillRect(r.x, r.y, r.w, r.h);
|
||||
}
|
||||
|
||||
var divWidth = parseInt($div.css('width')) + bufferX;
|
||||
var divHeight = parseInt($div.css('height')) + bufferY;
|
||||
var strideX = divWidth / 4;
|
||||
var strideY = divHeight / 4;
|
||||
var data = ctx.getImageData(0, 0, w, h).data;
|
||||
|
||||
function isEmpty(x1, y1) {
|
||||
return (x1 >= 0 && y1 >= 0
|
||||
&& x1 < w && y1 < h
|
||||
&& data[(y1 * w + x1) * 4]);
|
||||
}
|
||||
|
||||
function isEmptyBox(x1, y1) {
|
||||
return (isEmpty(x1, y1)
|
||||
&& isEmpty(x1 + (divWidth - 1), y1)
|
||||
&& isEmpty(x1, y1 + (divHeight - 1))
|
||||
&& isEmpty(x1 + (divWidth - 1), y1 + (divHeight - 1)));
|
||||
}
|
||||
|
||||
for(var y = startY; y < h; y += strideY) {
|
||||
for(var x = startX; x < w; x += strideX) {
|
||||
if(isEmptyBox(x, y)) {
|
||||
for(; y > startY + 1; y--) {
|
||||
if(!isEmptyBox(x, y - 1))
|
||||
break;
|
||||
}
|
||||
|
||||
for(; x > startX + 1; x--) {
|
||||
if(!isEmptyBox(x - 1, y))
|
||||
break;
|
||||
}
|
||||
|
||||
return { 'x': x, 'y': y };
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return { 'x': startX, 'y': h };
|
||||
}
|
||||
}
|
||||
|
||||
@ -161,8 +255,12 @@ var grid = new ArrangeClass("Grid", function(value) {
|
||||
|
||||
if(immediately)
|
||||
$el.css({top: y,left: x});
|
||||
else
|
||||
$el.animate({top: y,left: x}, 1000);
|
||||
else {
|
||||
TabMirror.pausePainting();
|
||||
$el.animate({top: y,left: x}, 500, null, function() {
|
||||
TabMirror.resumePainting();
|
||||
});
|
||||
}
|
||||
|
||||
x += $el.width() + 30;
|
||||
if( x > window.innerWidth - ($el.width() + startX)){ // includes allowance for the box shadow
|
||||
@ -174,17 +272,64 @@ var grid = new ArrangeClass("Grid", function(value) {
|
||||
|
||||
//----------------------------------------------------------
|
||||
var stack = new ArrangeClass("Stack", function() {
|
||||
var x = 30;
|
||||
var y = 100;
|
||||
var startX = 30;
|
||||
var startY = 100;
|
||||
var x = startX;
|
||||
var y = startY;
|
||||
$(".tab:visible").each(function(i){
|
||||
$el = $(this);
|
||||
$el.animate({'top': y, 'left': x, '-moz-transform': 'rotate(40deg)'}, 1000);
|
||||
TabMirror.pausePainting();
|
||||
$el.animate({'top': y, 'left': x, '-moz-transform': 'rotate(40deg)'}, 500, null, function() {
|
||||
TabMirror.resumePainting();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
//----------------------------------------------------------
|
||||
var site = new ArrangeClass("Site", function() {
|
||||
var startX = 30;
|
||||
var startY = 100;
|
||||
var x = startX;
|
||||
var y = startY;
|
||||
var x2;
|
||||
var y2;
|
||||
var positions = [];
|
||||
$(".tab:visible").each(function(i) {
|
||||
$el = $(this);
|
||||
var tab = Tabs.tab(this);
|
||||
var url = tab.url;
|
||||
var domain = url.split('/')[2];
|
||||
var domainParts = domain.split('.');
|
||||
var mainDomain = domainParts[domainParts.length - 2];
|
||||
if(positions[mainDomain]) {
|
||||
x2 = positions[mainDomain].x;
|
||||
y2 = positions[mainDomain].y;
|
||||
} else {
|
||||
x2 = x;
|
||||
y2 = y;
|
||||
|
||||
x += $el.width() + 30;
|
||||
if( x > window.innerWidth - ($el.width() + startX)){ // includes allowance for the box shadow
|
||||
x = startX;
|
||||
y += $el.height() + 30;
|
||||
}
|
||||
|
||||
positions[mainDomain] = { 'x': x2, 'y': y2 };
|
||||
}
|
||||
|
||||
TabMirror.pausePainting();
|
||||
$el.animate({'top': y2, 'left': x2, '-moz-transform': 'rotate(40deg)'}, 500, null, function() {
|
||||
TabMirror.resumePainting();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
//----------------------------------------------------------
|
||||
var Arrange = {
|
||||
initialized: false,
|
||||
|
||||
init: function(){
|
||||
this.initialized = true;
|
||||
grid.arrange(true);
|
||||
}
|
||||
}
|
||||
@ -197,14 +342,12 @@ UIClass.prototype = {
|
||||
init: function(){
|
||||
Page.init();
|
||||
Arrange.init();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//----------------------------------------------------------
|
||||
var UI = new UIClass();
|
||||
window.UI = UI;
|
||||
//window.aza = ArrangeClass
|
||||
|
||||
})();
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user