// ==UserScript== // @name ToolbarAutoHide.uc.js // ==/UserScript== /* userChrome.cssで /* #navigator-toolbox #toolbar-menubar { -moz-box-ordinal-group : 1;} /* 等と、-moz-box-ordinal-group を指定してあると表示が乱れる場合があります。 /* 各自、修正してください。 /* もっとスマートに低負荷にできると思いますが、私のスキルではこれが限界です。 /* 誰でも改造してより良いものを作ってください。 */ (function () { if (location != 'chrome://browser/content/browser.xhtml') return; try { let navbox = document.getElementById('navigator-toolbox'); let menubar = document.getElementById('toolbar-menubar'); let tabsbar = document.getElementById('TabsToolbar'); let navbar = document.getElementById('nav-bar'); let perbar = document.getElementById('PersonalToolbar'); // toolbarの属性変化を監視 let observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { toolbarFlag(mutation); }); }); let config = { attributes: true, attributeOldValue: true, attributeFilter: ['customizing', 'autohide', 'collapsed', 'barAuto'] }; observer.observe(menubar, config); observer.observe(tabsbar, config); observer.observe(navbar, config); observer.observe(perbar, config); // tabsbarのリサイズを監視 let resizeObserver = new ResizeObserver(function (entries) { entries.forEach(function (entry) { toolbarFlag(entry); }); }); resizeObserver.observe(tabsbar); /**/ // タブバー、ナビバーも隠せるように tabsbar.setAttribute('toolbarname', tabsbar.getAttribute('aria-label')); navbar.setAttribute('toolbarname', navbar.getAttribute('aria-label')); /* // ブックマークバーはデフォルトで自動開閉に menubar.removeAttribute('barAuto'); tabsbar.removeAttribute('barAuto'); navbar.removeAttribute('barAuto'); perbar.setAttribute('barAuto', 'true'); */ // 自動開閉するかどうかをfirefoxに保存 menubar.setAttribute('persist', 'barAuto'); tabsbar.setAttribute('persist', 'barAuto'); navbar.setAttribute('persist', 'barAuto'); perbar.setAttribute('persist', 'barAuto'); // タブバーは不具合多発なので起動時は自動開閉しないように tabsbar.removeAttribute('barAuto'); // 全消し用にナビゲーションボックスに空要素追加 ダブルクリックで復活 let box = MozXULElement.parseXULToFragment(` `); navbox.appendChild(box); /* // コンテキストメニューのヘッドにツールバーのコンテキストメニュー追加 document.getElementById('context-navigation').setAttribute('context', 'toolbar-context-menu'); */ // ツールバーメニューに項目追加 let menu = MozXULElement.parseXULToFragment(` `); document.getElementById('menu_customizeToolbars').before(menu); // ナビゲーション上の右クリックメニューに追加 let contextmenu = MozXULElement.parseXULToFragment(` `); document.getElementById('viewToolbarsMenuSeparator').after(contextmenu); let uccss = ` #navigator-toolbox #titlebar { -moz-box-ordinal-group : 0; } #navigator-toolbox #toolbar-menubar { -moz-box-ordinal-group : 1; } #navigator-toolbox #TabsToolbar { -moz-box-ordinal-group : 2; } #navigator-toolbox #nav-bar { -moz-box-ordinal-group : 3; } #navigator-toolbox #PersonalToolbar { -moz-box-ordinal-group : 4; } #navigator-toolbox[barsAuto]:not([custommode]) { z-index : 100 !important; position : relative !important; } #navigator-toolbox[barsAuto]:not(:-moz-lwtheme, [custommode]) { background-color : var(--toolbar-bgcolor) !important; background-image : var(--toolbar-bgimage) !important; } #navigator-toolbox[barsAuto]:-moz-lwtheme:not([custommode]) { background-color : var(--lwt-accent-color) !important; background-image : var(--lwt-header-image, var(--lwt-additional-images)) !important; } #navigator-toolbox:not([inFullscreen], [custommode]) #nav-box-escape[notShown] { -moz-box-ordinal-group : 10; transition : all 0.3s ease 0s; height : 5px; cursor : alias; } #navigator-toolbox:not([inFullscreen], [custommode]) #nav-box-escape:not([notShown]) { display : none; } #navigator-toolbox:not([inFullscreen], [custommode]) #nav-box-escape[allAuto] { margin-block-end : -5px; } #navigator-toolbox:not([inFullscreen], [custommode]):hover #nav-box-escape[allAuto] { height : 0; margin-block-end : 0; } #navigator-toolbox[barsAuto]:not([inFullscreen], [custommode]) { margin-block-end : 0; transition : all 0.3s ease 0s !important; } #navigator-toolbox[barsAuto]:not([inFullscreen], [custommode]):hover { margin-block-end : calc(var(--barshide-height) * -1px); } #navigator-toolbox:not([inFullscreen], [custommode]) > #titlebar[barsAuto] { margin-block-start : calc(var(--ttlhide-height) * -1px) !important; transition : all 0.3s ease 0s !important; } #navigator-toolbox:not([inFullscreen], [custommode]):hover > #titlebar[barsAuto] { margin-block-start : 0 !important; } #navigator-toolbox:not([inFullscreen], [custommode]) > #titlebar[barsAuto] #toolbar-menubar:not([barAuto]), #navigator-toolbox:not([inFullscreen], [custommode]) > #titlebar[barsAuto] #TabsToolbar:not([barAuto]) { -moz-box-ordinal-group : 2; } #navigator-toolbox:not([inFullscreen], [custommode]) #toolbar-menubar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]) #TabsToolbar[barAuto] { -moz-box-ordinal-group : 1; transition : all 0.3s ease 0s !important; opacity : 0 !important; } #navigator-toolbox:not([inFullscreen], [custommode]):hover #toolbar-menubar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]):hover > #titlebar[barsAuto] #TabsToolbar:not([barAuto]) { -moz-box-ordinal-group : 1; } #navigator-toolbox:not([inFullscreen], [custommode]):hover > #titlebar[barsAuto] #toolbar-menubar:not([barAuto]), #navigator-toolbox:not([inFullscreen], [custommode]):hover #TabsToolbar[barAuto] { -moz-box-ordinal-group : 2; } #navigator-toolbox:not([inFullscreen], [custommode]) #nav-bar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]) #PersonalToolbar[barAuto] { margin-block-start : calc(var(--barhide-height) * -1px) !important; transition : all 0.3s ease 0s !important; opacity : 0 !important; } #navigator-toolbox:not([inFullscreen], [custommode]):hover #toolbar-menubar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]):hover #TabsToolbar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]):hover #nav-bar[barAuto], #navigator-toolbox:not([inFullscreen], [custommode]):hover #PersonalToolbar[barAuto] { margin-block-start : 0 !important; opacity : 1 !important; } `; let ucuri = makeURI('data:text/css;charset=UTF=8,' + encodeURIComponent(uccss)); let ucsss = Cc['@mozilla.org/content/style-sheet-service;1'] .getService(Ci.nsIStyleSheetService); ucsss.loadAndRegisterSheet(ucuri, ucsss.AGENT_SHEET); } catch (e) { }; })(); // 起動時にセット window.addEventListener('MozAfterPaint', toolbarsset, { once: true }); // ESCキーでTabsToolbar,nav-barを強制表示 document.addEventListener('keydown', function (event) { if (event.keyCode == 27) navescape(); }); // 全消し時のバーをダブルクリックで復活 document.getElementById('nav-box-escape').addEventListener('dblclick', navescape); function navescape() { document.getElementById('nav-bar').setAttribute('collapsed', 'false'); document.getElementById('nav-bar').removeAttribute('barAuto'); document.getElementById('TabsToolbar').setAttribute('collapsed', 'false'); document.getElementById('TabsToolbar').removeAttribute('barAuto'); } // ツールバーの属性値変化(カスタマイズ、非表示) function toolbarFlag(aEvent) { let barelm = aEvent.target; let attribute = aEvent.attributeName; // タブ追加でタブバーが表示されるのをキャンセル if ((barelm.id == 'TabsToolbar') && (attribute == 'collapsed') && !(barelm.hasAttribute('collapsed'))) { barelm.setAttribute('collapsed', aEvent.oldValue); } toolbarsset(); } function toolbarsset() { let boxelm = document.getElementById('navigator-toolbox'); let ttlbar = document.getElementById('titlebar'); let escbox = document.getElementById('nav-box-escape'); let barelm, hidingAttr, barheight, hasShown; let barshide = 0, barsAuto = false, custommode = false, notShown = true; let ttlhide = 0, tbarsAuto = false, allAuto = false; let toolbarsid = ['toolbar-menubar', 'TabsToolbar', 'nav-bar', 'PersonalToolbar']; for (let toolbar of toolbarsid) { barelm = document.getElementById(toolbar); hidingAttr = (barelm.getAttribute('type') == 'menubar') ? 'autohide' : 'collapsed'; if (hasShown = (barelm.getAttribute(hidingAttr) == 'true')) barelm.removeAttribute('barAuto'); barheight = barelm.clientHeight; if (barelm.hasAttribute('barAuto')) { barsAuto = true; allAuto = true; barelm.style.setProperty("--barhide-height", barheight); barshide += barheight; if ((toolbar == 'toolbar-menubar') || (toolbar == 'TabsToolbar')) { tbarsAuto = true; ttlhide += barheight; } } else { if (!hasShown) notShown = false; barelm.style.setProperty("--barhide-height", 0); } if (barelm.hasAttribute('customizing')) custommode = true; } if (barsAuto) boxelm.setAttribute('barsAuto', 'true'); else boxelm.removeAttribute('barsAuto'); if (tbarsAuto) ttlbar.setAttribute('barsAuto', 'true'); else ttlbar.removeAttribute('barsAuto'); if (custommode) boxelm.setAttribute('custommode', 'true'); else boxelm.removeAttribute('custommode'); if (notShown) { escbox.setAttribute('notShown', 'true'); if (allAuto) escbox.setAttribute('allAuto', 'true'); else escbox.removeAttribute('allAuto'); } else { escbox.removeAttribute('notShown'); } boxelm.style.setProperty("--barshide-height", barshide); ttlbar.style.setProperty("--ttlhide-height", ttlhide); } // メニュー作成 function autoHideToolbarsPopupShowing(aEvent) { let popup = aEvent.target; if (popup != aEvent.currentTarget) return; while (popup.firstChild) popup.removeChild(popup.firstChild); // メニュークリア let toolbarsid = ['toolbar-menubar', 'TabsToolbar', 'nav-bar', 'PersonalToolbar']; let barelm, hidingAttr; for (let toolbar of toolbarsid) { barelm = document.getElementById(toolbar); hidingAttr = (barelm.getAttribute('type') == 'menubar') ? 'autohide' : 'collapsed'; let menuitem = MozXULElement.parseXULToFragment(` `); popup.append(menuitem); } } // 自動開閉メニューチェック function autoHideToolbar(aEvent) { let eventelm = aEvent.target; let barid = eventelm.getAttribute('toolbarId'); let barelm = document.getElementById(barid); if (eventelm.getAttribute('checked') == "true") { barelm.setAttribute('barAuto', 'true'); } else { barelm.removeAttribute('barAuto'); } }