diff --git a/browser/base/content/browser-places.js b/browser/base/content/browser-places.js index 6420a5c0263b..485d243fd905 100644 --- a/browser/base/content/browser-places.js +++ b/browser/base/content/browser-places.js @@ -312,8 +312,8 @@ var PlacesCommandHook = { // 1. the bookmarks menu button // 2. the page-proxy-favicon // 3. the content area - if (BookmarksMenuButton.anchor) { - StarUI.showEditBookmarkPopup(itemId, BookmarksMenuButton.anchor, + if (BookmarkingUI.anchor) { + StarUI.showEditBookmarkPopup(itemId, BookmarkingUI.anchor, "bottomcenter topright"); return; } @@ -991,12 +991,14 @@ let PlacesToolbarHelper = { }; //////////////////////////////////////////////////////////////////////////////// -//// BookmarksMenuButton +//// BookmarkingUI /** - * Handles the bookmarks menu-button in the toolbar. + * Handles the bookmarks star button in the URL bar, as well as the bookmark + * menu button. */ -let BookmarksMenuButton = { + +let BookmarkingUI = { get button() { if (!this._button) { this._button = document.getElementById("bookmarks-menu-button"); @@ -1005,22 +1007,18 @@ let BookmarksMenuButton = { }, get star() { - if (!this._star && this.button) { - this._star = document.getAnonymousElementByAttribute(this.button, - "anonid", - "button"); + if (!this._star) { + this._star = document.getElementById("star-button"); } return this._star; }, get anchor() { - if (!this._anchor && this.star && isElementVisible(this.star)) { + if (this.star && isElementVisible(this.star)) { // Anchor to the icon, so the panel looks more natural. - this._anchor = document.getAnonymousElementByAttribute(this.star, - "class", - "toolbarbutton-icon"); + return this.star; } - return this._anchor; + return null; }, STATUS_UPDATING: -1, @@ -1029,9 +1027,9 @@ let BookmarksMenuButton = { get status() { if (this._pendingStmt) return this.STATUS_UPDATING; - return this.button && - this.button.hasAttribute("starred") ? this.STATUS_STARRED - : this.STATUS_UNSTARRED; + return this.star && + this.star.hasAttribute("starred") ? this.STATUS_STARRED + : this.STATUS_UNSTARRED; }, get _starredTooltip() @@ -1055,11 +1053,11 @@ let BookmarksMenuButton = { * reasons. */ _popupNeedsUpdate: true, - onToolbarVisibilityChange: function BMB_onToolbarVisibilityChange() { + onToolbarVisibilityChange: function BUI_onToolbarVisibilityChange() { this._popupNeedsUpdate = true; }, - onPopupShowing: function BMB_onPopupShowing(event) { + onPopupShowing: function BUI_onPopupShowing(event) { // Don't handle events for submenus. if (event.target != event.currentTarget) return; @@ -1093,26 +1091,21 @@ let BookmarksMenuButton = { /** * Handles star styling based on page proxy state changes. */ - onPageProxyStateChanged: function BMB_onPageProxyStateChanged(aState) { + onPageProxyStateChanged: function BUI_onPageProxyStateChanged(aState) { if (!this.star) { return; } if (aState == "invalid") { this.star.setAttribute("disabled", "true"); - this.button.removeAttribute("starred"); + this.star.removeAttribute("starred"); } else { this.star.removeAttribute("disabled"); } - this._updateStyle(); }, - _updateStyle: function BMB__updateStyle() { - if (!this.star) { - return; - } - + _updateToolbarStyle: function BUI__updateToolbarStyle() { let personalToolbar = document.getElementById("PersonalToolbar"); let onPersonalToolbar = this.button.parentNode == personalToolbar || this.button.parentNode.parentNode == personalToolbar; @@ -1127,7 +1120,7 @@ let BookmarksMenuButton = { } }, - _uninitView: function BMB__uninitView() { + _uninitView: function BUI__uninitView() { // When an element with a placesView attached is removed and re-inserted, // XBL reapplies the binding causing any kind of issues and possible leaks, // so kill current view and let popupshowing generate a new one. @@ -1136,24 +1129,22 @@ let BookmarksMenuButton = { } }, - customizeStart: function BMB_customizeStart() { + customizeStart: function BUI_customizeStart() { this._uninitView(); }, - customizeChange: function BMB_customizeChange() { - this._updateStyle(); + customizeChange: function BUI_customizeChange() { + this._updateToolbarStyle(); }, - customizeDone: function BMB_customizeDone() { + customizeDone: function BUI_customizeDone() { delete this._button; - delete this._star; - delete this._anchor; this.onToolbarVisibilityChange(); - this._updateStyle(); + this._updateToolbarStyle(); }, _hasBookmarksObserver: false, - uninit: function BMB_uninit() { + uninit: function BUI_uninit() { this._uninitView(); if (this._hasBookmarksObserver) { @@ -1166,8 +1157,8 @@ let BookmarksMenuButton = { } }, - updateStarState: function BMB_updateStarState() { - if (!this.button || (this._uri && gBrowser.currentURI.equals(this._uri))) { + updateStarState: function BUI_updateStarState() { + if (!this.star || (this._uri && gBrowser.currentURI.equals(this._uri))) { return; } @@ -1215,22 +1206,22 @@ let BookmarksMenuButton = { }, this); }, - _updateStar: function BMB__updateStar() { - if (!this.button) { + _updateStar: function BUI__updateStar() { + if (!this.star) { return; } if (this._itemIds.length > 0) { - this.button.setAttribute("starred", "true"); - this.button.setAttribute("tooltiptext", this._starredTooltip); + this.star.setAttribute("starred", "true"); + this.star.setAttribute("tooltiptext", this._starredTooltip); } else { - this.button.removeAttribute("starred"); - this.button.setAttribute("tooltiptext", this._unstarredTooltip); + this.star.removeAttribute("starred"); + this.star.setAttribute("tooltiptext", this._unstarredTooltip); } }, - onCommand: function BMB_onCommand(aEvent) { + onCommand: function BUI_onCommand(aEvent) { if (aEvent.target != aEvent.currentTarget) { return; } @@ -1241,12 +1232,8 @@ let BookmarksMenuButton = { }, // nsINavBookmarkObserver - onItemAdded: function BMB_onItemAdded(aItemId, aParentId, aIndex, aItemType, + onItemAdded: function BUI_onItemAdded(aItemId, aParentId, aIndex, aItemType, aURI) { - if (!this.button) { - return; - } - if (aURI && aURI.equals(this._uri)) { // If a new bookmark has been added to the tracked uri, register it. if (this._itemIds.indexOf(aItemId) == -1) { @@ -1256,11 +1243,7 @@ let BookmarksMenuButton = { } }, - onItemRemoved: function BMB_onItemRemoved(aItemId) { - if (!this.button) { - return; - } - + onItemRemoved: function BUI_onItemRemoved(aItemId) { let index = this._itemIds.indexOf(aItemId); // If one of the tracked bookmarks has been removed, unregister it. if (index != -1) { @@ -1269,12 +1252,8 @@ let BookmarksMenuButton = { } }, - onItemChanged: function BMB_onItemChanged(aItemId, aProperty, + onItemChanged: function BUI_onItemChanged(aItemId, aProperty, aIsAnnotationProperty, aNewValue) { - if (!this.button) { - return; - } - if (aProperty == "uri") { let index = this._itemIds.indexOf(aItemId); // If the changed bookmark was tracked, check if it is now pointing to @@ -1299,5 +1278,5 @@ let BookmarksMenuButton = { QueryInterface: XPCOMUtils.generateQI([ Ci.nsINavBookmarkObserver - ]), + ]) }; diff --git a/browser/base/content/browser.css b/browser/base/content/browser.css index 579546d43535..ff4e0da877a2 100644 --- a/browser/base/content/browser.css +++ b/browser/base/content/browser.css @@ -308,20 +308,18 @@ toolbarbutton.bookmark-item { max-width: 13em; } +%ifdef MENUBAR_CAN_AUTOHIDE +#toolbar-menubar:not([autohide="true"]) ~ toolbar > #bookmarks-menu-button, +#toolbar-menubar:not([autohide="true"]) > #bookmarks-menu-button { + display: none; +} +%endif + #editBMPanel_tagsSelector { /* override default listbox width from xul.css */ width: auto; } -/* The star doesn't make sense as text */ -toolbar[mode="text"] #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - display: -moz-box !important; -} -toolbar[mode="text"] #bookmarks-menu-button > .toolbarbutton-menubutton-button > .toolbarbutton-text, -toolbar[mode="full"] #bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-text { - display: none; -} - menupopup[emptyplacesresult="true"] > .hide-if-empty-places-result { display: none; } diff --git a/browser/base/content/browser.js b/browser/base/content/browser.js index 61650a9ec614..9314ffd7cfa8 100644 --- a/browser/base/content/browser.js +++ b/browser/base/content/browser.js @@ -1313,7 +1313,7 @@ var gBrowserInit = { } catch (ex) { } - BookmarksMenuButton.uninit(); + BookmarkingUI.uninit(); TabsOnTop.uninit(); @@ -2231,7 +2231,7 @@ function UpdatePageProxyState() function SetPageProxyState(aState) { - BookmarksMenuButton.onPageProxyStateChanged(aState); + BookmarkingUI.onPageProxyStateChanged(aState); if (!gURLBar) return; @@ -3327,7 +3327,7 @@ function BrowserCustomizeToolbar() { CombinedStopReload.uninit(); PlacesToolbarHelper.customizeStart(); - BookmarksMenuButton.customizeStart(); + BookmarkingUI.customizeStart(); DownloadsButton.customizeStart(); TabsInTitlebar.allowedBy("customizing-toolbars", false); @@ -3391,7 +3391,7 @@ function BrowserToolboxCustomizeDone(aToolboxChanged) { } PlacesToolbarHelper.customizeDone(); - BookmarksMenuButton.customizeDone(); + BookmarkingUI.customizeDone(); DownloadsButton.customizeDone(); // The url bar splitter state is dependent on whether stop/reload @@ -3404,7 +3404,7 @@ function BrowserToolboxCustomizeDone(aToolboxChanged) { if (gURLBar) { URLBarSetURI(); XULBrowserWindow.asyncUpdateUI(); - BookmarksMenuButton.updateStarState(); + BookmarkingUI.updateStarState(); SocialMark.updateMarkState(); SocialShare.update(); } @@ -3433,7 +3433,7 @@ function BrowserToolboxCustomizeChange(aType) { break; default: gHomeButton.updatePersonalToolbarStyle(); - BookmarksMenuButton.customizeChange(); + BookmarkingUI.customizeChange(); } } @@ -3879,7 +3879,7 @@ var XULBrowserWindow = { URLBarSetURI(aLocationURI); // Update starring UI - BookmarksMenuButton.updateStarState(); + BookmarkingUI.updateStarState(); SocialMark.updateMarkState(); SocialShare.update(); } @@ -4507,7 +4507,7 @@ function setToolbarVisibility(toolbar, isVisible) { document.persist(toolbar.id, hidingAttribute); PlacesToolbarHelper.init(); - BookmarksMenuButton.onToolbarVisibilityChange(); + BookmarkingUI.onToolbarVisibilityChange(); gBrowser.updateWindowResizers(); #ifdef MENUBAR_CAN_AUTOHIDE diff --git a/browser/base/content/browser.xul b/browser/base/content/browser.xul index ba1858f783ee..db4b6d7ecaf1 100644 --- a/browser/base/content/browser.xul +++ b/browser/base/content/browser.xul @@ -581,6 +581,9 @@ hidden="true" tooltiptext="&pageReportIcon.tooltip;" onclick="gPopupBlockerObserver.onReportButtonClick(event);"/> + + ondrop="PlacesMenuDNDHandler.onDrop(event);"> @@ -665,6 +667,13 @@ command="Browser:ShowAllBookmarks" key="manBookmarkKb"/> + .toolbarbutton-menubutton-button { -moz-image-region: rect(0px 48px 24px 24px); } -#bookmarks-button { +#bookmarks-button, +#bookmarks-menu-button { -moz-image-region: rect(0px 72px 24px 48px); } +#bookmarks-menu-button.bookmark-item { + list-style-image: url("chrome://browser/skin/Toolbar-small.png"); +} + +#bookmarks-menu-button.toolbarbutton-1 { + -moz-box-orient: horizontal; +} + #print-button { list-style-image: url("moz-icon://stock/gtk-print?size=toolbar"); } @@ -806,7 +819,9 @@ toolbar[iconsize="small"] #history-button { -moz-image-region: rect(0px 32px 16px 16px); } -toolbar[iconsize="small"] #bookmarks-button { +toolbar[iconsize="small"] #bookmarks-button, +toolbar[iconsize="small"] #bookmarks-menu-button, +#bookmarks-menu-button.bookmark-item { -moz-image-region: rect(0px 48px 16px 32px); } @@ -1505,28 +1520,17 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 16px, 16px, 0); } +/* Star button */ +#star-button { + list-style-image: url("chrome://browser/skin/places/starPage.png"); +} + +#star-button[starred="true"] { + list-style-image: url("chrome://browser/skin/places/pageStarred.png"); +} + /* bookmarks menu-button */ -#bookmarks-menu-button { - list-style-image: url("chrome://browser/skin/Toolbar.png"); - -moz-image-region: rect(0px 216px 24px 192px); -} - -#bookmarks-menu-button[starred] { - -moz-image-region: rect(24px 216px 48px 192px); -} - -toolbar[iconsize="small"] #bookmarks-menu-button, -#bookmarks-menu-button.bookmark-item { - list-style-image: url("chrome://browser/skin/Toolbar-small.png"); - -moz-image-region: rect(0px 144px 16px 128px); -} - -toolbar[iconsize="small"] #bookmarks-menu-button[starred], -#bookmarks-menu-button.bookmark-item[starred] { - -moz-image-region: rect(16px 144px 32px 128px); -} - #bookmarks-menu-button[disabled] > .toolbarbutton-icon, #bookmarks-menu-button[disabled] > .toolbarbutton-menu-dropmarker, #bookmarks-menu-button[disabled] > .toolbarbutton-menubutton-dropmarker, diff --git a/browser/themes/linux/jar.mn b/browser/themes/linux/jar.mn index e6ac703dd18a..2dfb46208fc2 100644 --- a/browser/themes/linux/jar.mn +++ b/browser/themes/linux/jar.mn @@ -82,6 +82,7 @@ browser.jar: skin/classic/browser/places/calendar.png (places/calendar.png) * skin/classic/browser/places/editBookmarkOverlay.css (places/editBookmarkOverlay.css) skin/classic/browser/places/livemark-item.png (places/livemark-item.png) + skin/classic/browser/places/pageStarred.png (places/pageStarred.png) skin/classic/browser/places/star-icons.png (places/star-icons.png) skin/classic/browser/places/starred48.png (places/starred48.png) skin/classic/browser/places/unstarred48.png (places/unstarred48.png) @@ -89,6 +90,7 @@ browser.jar: skin/classic/browser/places/organizer.css (places/organizer.css) skin/classic/browser/places/organizer.xml (places/organizer.xml) skin/classic/browser/places/query.png (places/query.png) + skin/classic/browser/places/starPage.png (places/starPage.png) skin/classic/browser/places/tag.png (places/tag.png) skin/classic/browser/places/toolbarDropMarker.png (places/toolbarDropMarker.png) skin/classic/browser/places/unsortedBookmarks.png (places/unsortedBookmarks.png) diff --git a/browser/themes/linux/places/pageStarred.png b/browser/themes/linux/places/pageStarred.png new file mode 100644 index 000000000000..61a9f90e05b1 Binary files /dev/null and b/browser/themes/linux/places/pageStarred.png differ diff --git a/browser/themes/linux/places/starPage.png b/browser/themes/linux/places/starPage.png new file mode 100644 index 000000000000..3193a3535f1e Binary files /dev/null and b/browser/themes/linux/places/starPage.png differ diff --git a/browser/themes/osx/browser.css b/browser/themes/osx/browser.css index 08d5e3ea06b3..188d4ebd66d2 100644 --- a/browser/themes/osx/browser.css +++ b/browser/themes/osx/browser.css @@ -901,7 +901,8 @@ toolbar[mode="icons"] #forward-button:-moz-lwtheme { /* bookmark sidebar & menu buttons */ -#bookmarks-button { +#bookmarks-button, +#bookmarks-menu-button { -moz-image-region: rect(0, 180px, 20px, 160px); } @@ -909,14 +910,33 @@ toolbar[mode="icons"] #forward-button:-moz-lwtheme { -moz-image-region: rect(20px, 180px, 40px, 160px); } +#bookmarks-menu-button.bookmark-item { + -moz-image-region: rect(2px, 178px, 18px, 162px); + list-style-image: url("chrome://browser/skin/Toolbar.png"); +} + @media (min-resolution: 2dppx) { - #bookmarks-button { + #bookmarks-button, + #bookmarks-menu-button { -moz-image-region: rect(0, 360px, 40px, 320px); } #bookmarks-button[checked="true"] { -moz-image-region: rect(40px, 360px, 80px, 320px); } + + #bookmarks-menu-button.bookmark-item { + -moz-image-region: rect(4px, 356px, 36px, 324px); + list-style-image: url("chrome://browser/skin/Toolbar@2x.png"); + } + + #bookmarks-menu-button.bookmark-item > .toolbarbutton-icon { + width: 16px; + } +} + +#bookmarks-menu-button.toolbarbutton-1 { + -moz-box-orient: horizontal; } /* print button */ @@ -1717,49 +1737,35 @@ window[tabsontop="false"] richlistitem[type~="action"][actiontype="switchtab"][s -moz-image-region: rect(0, 16px, 16px, 0); } -/* bookmarks menu-button */ - -#bookmarks-menu-button { - -moz-image-region: rect(0px 500px 20px 480px); -} - -#bookmarks-menu-button[starred] { - -moz-image-region: rect(20px 500px 40px 480px); -} - -#bookmarks-menu-button.bookmark-item { +/* Star button */ +#star-button { list-style-image: url("chrome://browser/skin/places/star-icons.png"); - -moz-image-region: rect(0px 16px 16px 0px); + -moz-image-region: rect(0, 16px, 16px, 0); } -#bookmarks-menu-button.bookmark-item[starred] { - -moz-image-region: rect(0px 32px 16px 16px); +#star-button:hover:active, +#star-button[starred="true"] { + -moz-image-region: rect(0, 32px, 16px, 16px); } -#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button { - padding: 0; +#star-button:hover:active[starred="true"] { + -moz-image-region: rect(0, 48px, 16px, 32px); } @media (min-resolution: 2dppx) { - #bookmarks-menu-button { - -moz-image-region: rect(0px, 1000px, 40px, 960px); + #star-button { + list-style-image: url("chrome://browser/skin/places/star-icons.png"); + -moz-image-region: rect(0, 32px, 32px, 0); + width: 22px; } - #bookmarks-menu-button[starred] { - -moz-image-region: rect(40px, 1000px, 80px, 960px); + #star-button:hover:active, + #star-button[starred="true"] { + -moz-image-region: rect(0, 64px, 32px, 32px); } - #bookmarks-menu-button.bookmark-item { - list-style-image: url("chrome://browser/skin/places/star-icons@2x.png"); - -moz-image-region: rect(0px 32px 32px 0px); - } - - #bookmarks-menu-button.bookmark-item[starred] { - -moz-image-region: rect(0px 64px 32px 32px); - } - - #bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - width: 16px; + #star-button:hover:active[starred="true"] { + -moz-image-region: rect(0, 96px, 32px, 64px); } } diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css index abc17fb21c20..6f9d09338048 100644 --- a/browser/themes/windows/browser.css +++ b/browser/themes/windows/browser.css @@ -607,7 +607,7 @@ toolbarbutton.bookmark-item[open="true"] { -moz-padding-end: 2px; } -.bookmark-item > .toolbarbutton-icon { +.bookmark-item:not(#bookmarks-menu-button) > .toolbarbutton-icon { width: 16px; height: 16px; } @@ -1085,10 +1085,19 @@ toolbar[mode=full] .toolbarbutton-1 > .toolbarbutton-menubutton-button { -moz-image-region: rect(0, 126px, 18px, 108px); } -#bookmarks-button { +#bookmarks-button, +#bookmarks-menu-button { -moz-image-region: rect(0, 144px, 18px, 126px); } +#bookmarks-menu-button.bookmark-item { + list-style-image: url("chrome://browser/skin/Toolbar.png"); +} + +#bookmarks-menu-button.bookmark-item:-moz-lwtheme-brighttext { + list-style-image: url("chrome://browser/skin/Toolbar-inverted.png"); +} + #print-button { -moz-image-region: rect(0, 162px, 18px, 144px); } @@ -1806,27 +1815,25 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 16px, 16px, 0); } -/* bookmarks menu-button */ +/* star button */ -#bookmarks-menu-button { - -moz-image-region: rect(0px 378px 18px 360px); -} - -#bookmarks-menu-button[starred] { - -moz-image-region: rect(18px 378px 36px 360px); -} - -#bookmarks-menu-button.bookmark-item { +#star-button { list-style-image: url("chrome://browser/skin/places/bookmark.png"); -moz-image-region: rect(0px 16px 16px 0px); } -#bookmarks-menu-button.bookmark-item[starred] { +#star-button:hover { + background-image: radial-gradient(circle closest-side, hsla(45,100%,73%,.3), hsla(45,100%,73%,0)); + -moz-image-region: rect(0px 32px 16px 16px); +} + +#star-button:hover:active { + background-image: radial-gradient(circle closest-side, hsla(45,100%,73%,.1), hsla(45,100%,73%,0)); -moz-image-region: rect(0px 48px 16px 32px); } -#bookmarks-menu-button.bookmark-item > .toolbarbutton-menubutton-button> .toolbarbutton-icon { - -moz-margin-start: 5px; +#star-button[starred] { + list-style-image: url("chrome://browser/skin/places/editBookmark.png"); } /* bookmarking panel */ diff --git a/browser/themes/windows/jar.mn b/browser/themes/windows/jar.mn index d33be1938429..939d629cc292 100644 --- a/browser/themes/windows/jar.mn +++ b/browser/themes/windows/jar.mn @@ -95,6 +95,7 @@ browser.jar: skin/classic/browser/newtab/noise.png (newtab/noise.png) skin/classic/browser/places/places.css (places/places.css) * skin/classic/browser/places/organizer.css (places/organizer.css) + skin/classic/browser/places/editBookmark.png (places/editBookmark.png) skin/classic/browser/places/bookmark.png (places/bookmark.png) skin/classic/browser/places/query.png (places/query.png) skin/classic/browser/places/bookmarksMenu.png (places/bookmarksMenu.png) @@ -346,6 +347,7 @@ browser.jar: * skin/classic/aero/browser/places/places.css (places/places-aero.css) * skin/classic/aero/browser/places/organizer.css (places/organizer-aero.css) skin/classic/aero/browser/places/bookmark.png (places/bookmark.png) + skin/classic/aero/browser/places/editBookmark.png (places/editBookmark.png) skin/classic/aero/browser/places/query.png (places/query-aero.png) skin/classic/aero/browser/places/bookmarksMenu.png (places/bookmarksMenu-aero.png) skin/classic/aero/browser/places/bookmarksToolbar.png (places/bookmarksToolbar-aero.png) diff --git a/browser/themes/windows/places/editBookmark.png b/browser/themes/windows/places/editBookmark.png new file mode 100644 index 000000000000..fbca0523df16 Binary files /dev/null and b/browser/themes/windows/places/editBookmark.png differ