diff --git a/modules/themeManager.js b/modules/themeManager.js index e790c374..f884ffeb 100644 --- a/modules/themeManager.js +++ b/modules/themeManager.js @@ -37,16 +37,75 @@ const EXPORTED_SYMBOLS = ['TreeStyleTabThemeManager']; Components.utils.import('resource://treestyletab-modules/utils.js'); -var TreeStyleTabThemeManager = { - preLoadImagesForStyle : function(aStyle) +function TreeStyleTabThemeManager(aWindow) +{ + this.window = aWindow; + this._preLoadImagesForStyleDone = []; + this._preLoadImagesForStyleDoneImages = []; +} +TreeStyleTabThemeManager.prototype = { + destroy : function() { + delete this.window; + }, + + set : function(aStyle, aPosition) + { + if (this._lastStyles) + this._lastStyles.forEach(function(aStyle) { + aStyle.parentNode.removeChild(aStyle); + }); + this._lastStyles = null; + + var styles = []; + switch (aStyle) + { + case 'default': + default: + + case 'flat': + case 'mixed': + styles.push('chrome://treestyletab/skin/square/square.css'); + styles.push('chrome://treestyletab/skin/square/dropshadow.css'); + break; + + case 'vertigo': + styles.push('chrome://treestyletab/skin/square/square.css'); + break; + + case 'metal': + styles.push('chrome://treestyletab/skin/metal/metal.css'); + break; + + case 'sidebar': + styles.push('chrome://treestyletab/skin/sidebar/sidebar.css'); + break; + } + + if (styles.length) { + this._lastStyles = styles.map(function(aStyle) { + var d = this.window.document; + var pi = d.createProcessingInstruction( + 'xml-stylesheet', + 'type="text/css" href="'+aStyle+'"' + ); + d.insertBefore(pi, d.documentElement); + return pi; + }, this); + this.preloadImages(aStyle, aPosition); + } + }, + + preloadImages : function(aStyle, aPosition) + { + var key = aStyle+'-'+aPosition; if (!aStyle || - this._preLoadImagesForStyleDone.indexOf(aStyle) > -1) + this._preLoadImagesForStyleDone.indexOf(key) > -1) return; - this._preLoadImagesForStyleDone.push(aStyle); + this._preLoadImagesForStyleDone.push(key); var images = aStyle in this._preLoadImages ? - this._preLoadImages[aStyle] : + this._preLoadImages[key] : null ; if (!images) return; @@ -54,12 +113,11 @@ var TreeStyleTabThemeManager = { if (this._preLoadImagesForStyleDoneImages.indexOf(aImage) > -1) return; - (new Image()).src = aImage; + (new this.window.Image()).src = aImage; this._preLoadImagesForStyleDoneImages.push(aImage); }, this); }, - _preLoadImagesForStyleDone : [], - _preLoadImagesForStyleDoneImages : [], + _preLoadImages : { 'metal-left' : [ 'chrome://treestyletab/skin/metal/tab-active-l.png', diff --git a/modules/window.js b/modules/window.js index 1a534e5d..5d148a0f 100644 --- a/modules/window.js +++ b/modules/window.js @@ -46,11 +46,6 @@ XPCOMUtils.defineLazyGetter(this, 'TreeStyleTabBrowser', function() { Components.utils.import('resource://treestyletab-modules/browser.js', ns); return ns.TreeStyleTabBrowser; }); -XPCOMUtils.defineLazyGetter(this, 'TreeStyleTabThemeManager', function() { - var ns = {}; - Components.utils.import('resource://treestyletab-modules/themeManager.js', ns); - return ns.TreeStyleTabThemeManager; -}); function TreeStyleTabWindow(aWindow) { @@ -262,6 +257,26 @@ TreeStyleTabWindow.prototype = { ) : this.getTreePref('tabbar.autoHide.mode'); }, + + get autoHideWindow() + { + if (!this._autoHideWindow) { + let ns = {}; + Components.utils.import('resource://treestyletab-modules/autoHide.js', ns); + this._autoHideWindow = new ns.AutoHideWindow(this.window); + } + return this._autoHideWindow; + }, + + get themeManager() + { + if (!this._themeManager) { + let ns = {}; + Components.utils.import('resource://treestyletab-modules/themeManager.js', ns); + this._themeManager = new ns.TreeStyleTabThemeManager(this.window); + } + return this._themeManager; + }, /* Initializing */ @@ -280,6 +295,9 @@ TreeStyleTabWindow.prototype = { w.TreeStyleTabWindowHelper.preInit(); this.migratePrefs(); + + // initialize theme + this.onPrefChange('extensions.treestyletab.tabbar.style'); }, preInitialized : false, @@ -393,7 +411,11 @@ TreeStyleTabWindow.prototype = { w.removeEventListener('load', this, false); w.addEventListener('unload', this, false); - if (!this.browser) return; + if ( + w.location.href.indexOf('chrome://browser/content/browser.xul') != 0 || + !this.browser + ) + return; if (this.initialized) return; this.initialized = true; @@ -432,7 +454,6 @@ TreeStyleTabWindow.prototype = { // Init autohide service only if it have to be activated. if (this.isAutoHide) this.onPrefChange('extensions.treestyletab.tabbar.autoHide.mode'); - this.onPrefChange('extensions.treestyletab.tabbar.style'); this.onPrefChange('extensions.treestyletab.autoCollapseExpandSubtreeOnSelect.whileFocusMovingByShortcut'); }, initialized : false, @@ -535,6 +556,12 @@ TreeStyleTabWindow.prototype = { let w = this.window; w.removeEventListener('unload', this, false); + this.autoHideWindow.destroy(); + delete this._autoHideWindow; + + this.themeManager.destroy(); + delete this._themeManager; + this.browser.treeStyleTab.saveCurrentState(); this.destroyTabBrowser(this.browser); @@ -1171,16 +1198,6 @@ TreeStyleTabWindow.prototype = { } }, - get autoHideWindow() - { - if (!this._autoHideWindow) { - let ns = {}; - Components.utils.import('resource://treestyletab-modules/autoHide.js', ns); - this._autoHideWindow = new ns.AutoHideWindow(this.window); - } - return this._autoHideWindow; - }, - toggleAutoHide : function TSTWindow_toggleAutoHide(aTabBrowser) /* PUBLIC API, for backward compatibility */ { this.autoHideWindow.toggleMode(aTabBrowser || this.browser); @@ -1570,10 +1587,7 @@ TreeStyleTabWindow.prototype = { case 'extensions.treestyletab.tabbar.style': case 'extensions.treestyletab.tabbar.position': - TreeStyleTabThemeManager.preLoadImagesForStyle([ - this.getPref('extensions.treestyletab.tabbar.style'), - this.position - ].join('-')); + this.themeManager.set(this.getPref('extensions.treestyletab.tabbar.style'), this.position); break; case 'browser.ctrlTab.previews': diff --git a/skin/classic/treestyletab/square/square.css b/skin/classic/treestyletab/square/square.css index bf5b85ba..7db444c1 100644 --- a/skin/classic/treestyletab/square/square.css +++ b/skin/classic/treestyletab/square/square.css @@ -1,3 +1,5 @@ @import url("base.css"); @import url("tab-surface.css"); - +/* dynamically applied by themeManager.js +@import url("dropshadow.css"); +*/ diff --git a/skin/classic/treestyletab/treestyletab.css b/skin/classic/treestyletab/treestyletab.css index e0c2fcbc..9ddff5b4 100644 --- a/skin/classic/treestyletab/treestyletab.css +++ b/skin/classic/treestyletab/treestyletab.css @@ -1,8 +1,9 @@ @import url("base.css"); +/* dynamically applied by themeManager.js @import url("square/square.css"); -@import url("square/dropshadow.css"); @import url("metal/metal.css"); @import url("sidebar/sidebar.css"); +*/ @import url("ui.css");