diff --git a/wagtail/wagtailadmin/static_src/wagtailadmin/js/userbar.js b/wagtail/wagtailadmin/static_src/wagtailadmin/js/userbar.js
index 8c48d1a0b8..09a5f4ebd2 100644
--- a/wagtail/wagtailadmin/static_src/wagtailadmin/js/userbar.js
+++ b/wagtail/wagtailadmin/static_src/wagtailadmin/js/userbar.js
@@ -1,12 +1,24 @@
'use strict';
document.addEventListener('DOMContentLoaded', function() {
+ var trigger = document.querySelectorAll('[data-wagtail-userbar-trigger]')[0];
var userbar = document.querySelectorAll('[data-wagtail-userbar]')[0];
var className = 'is-active';
- userbar.addEventListener("mouseenter", showUserbar, false);
+ if ('ontouchstart' in window) {
+ userbar.classList.add("touch");
+ } else {
+ userbar.classList.add("no-touch");
+ }
+
+ trigger.addEventListener("mouseenter", showUserbar, false);
userbar.addEventListener("mouseleave", hideUserbar, false);
+ trigger.addEventListener("touchstart", toggleUserbar, false);
+
+ // make sure userbar is hidden when navigating back
+ window.addEventListener('pageshow', hideUserbar, false);
+
function showUserbar() {
userbar.classList.add(className);
}
@@ -14,5 +26,8 @@ document.addEventListener('DOMContentLoaded', function() {
function hideUserbar() {
userbar.classList.remove(className);
}
-});
+ function toggleUserbar() {
+ userbar.classList.toggle(className);
+ }
+});
diff --git a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/userbar.scss b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/userbar.scss
index 7ea37925ee..0a2a98bffc 100644
--- a/wagtail/wagtailadmin/static_src/wagtailadmin/scss/userbar.scss
+++ b/wagtail/wagtailadmin/static_src/wagtailadmin/scss/userbar.scss
@@ -9,39 +9,33 @@ $size-home-button: 3.5em;
position: fixed;
z-index: 9999;
bottom: 2em;
- right: 1.5em;
-
- a {
- display: block;
- overflow: hidden;
- text-decoration: none;
- }
+ right: 2em;
}
- .wagtail-userbar__home {
+ .wagtail-userbar__trigger {
width: $size-home-button;
height: $size-home-button;
+ overflow: hidden;
+
background-color: $color-white;
border-radius: 50%;
color: $color-black;
padding: 0;
- &:focus,
- &:hover {
- color: $color-black;
- }
+ cursor: pointer;
&.icon:before {
- @include transition(color 0.2s ease);
+ @include transition(color .2s ease);
font-size: 35px;
- margin: 0.2em 0.15em;
+ margin: .25em .15em .2em .175em;
display: block;
}
box-shadow: 0 0 1px 0 rgba(107, 214, 230, 1), 0 1px 10px 0 rgba(107, 214, 230, .7);
transition: all 0.2s ease-in-out;
- &:hover {
+ .wagtail-userbar.touch.is-active &,
+ .no-touch &:hover {
box-shadow: 0 0 1px 0 rgba(107, 214, 230, 1), 0 3px 15px 0 rgba(107, 214, 230, .95);
}
}
@@ -56,7 +50,7 @@ $size-home-button: 3.5em;
right: 0;
margin: 0;
padding-bottom: $width-arrow * 2;
- min-width:16em;
+ min-width: 17em;
visibility: hidden;
@@ -93,22 +87,22 @@ $size-home-button: 3.5em;
background-color: $color-grey-1;
&:first-child {
- border-top-left-radius: 0.5em;
- border-top-right-radius: 0.5em;
+ border-top-left-radius: .5em;
+ border-top-right-radius: .5em;
}
&:last-child {
- border-bottom-right-radius: 0.5em;
- border-bottom-left-radius: 0.5em;
+ border-bottom-right-radius: .5em;
+ border-bottom-left-radius: .5em;
}
& + li {
- border-top: 1px solid darken($color-grey-1, 4%);
+ border-top: 1px solid darken($color-grey-1, 3%);
}
transform: translateY(1em);
opacity: 0;
- transition-duration: .15s;
+ transition-duration: .125s;
transition-timing-function: cubic-bezier(.55,0,.1,1);
.wagtail-userbar.is-active & {
@@ -126,6 +120,8 @@ $size-home-button: 3.5em;
li a,
li .action {
color: #aaa;
+ display: block;
+ text-decoration: none;
&:hover,
&:focus {
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html
index 280f8a6745..1a4d4977a9 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html
@@ -5,7 +5,7 @@
{% endcompress %}
-
{% trans 'Go to Wagtail admin interface' %}
+
{% trans 'Go to Wagtail admin interface' %}
{% for item in items %}
{{ item|safe }}
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_admin.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_admin.html
new file mode 100644
index 0000000000..ba817755ac
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_admin.html
@@ -0,0 +1,8 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n %}
+
+{% block item_content %}
+
+{% endblock %}
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html
index fc45facd9f..98be9f5e08 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html
@@ -3,6 +3,6 @@
{% block item_content %}
{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_explore.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_explore.html
new file mode 100644
index 0000000000..7f9aee835e
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_explore.html
@@ -0,0 +1,8 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n %}
+
+{% block item_content %}
+
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templatetags/wagtailuserbar.py b/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
index 2a6d7d4b0a..9221dee423 100644
--- a/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
+++ b/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
@@ -6,8 +6,8 @@ from wagtail.wagtailcore.models import Page, PageRevision, PAGE_TEMPLATE_VAR
from django.shortcuts import render
# from django.contrib.auth.decorators import permission_required
-from wagtail.wagtailadmin.userbar import EditPageItem, AddPageItem, ApproveModerationEditPageItem, \
- RejectModerationEditPageItem
+from wagtail.wagtailadmin.userbar import AdminItem, ExplorePageItem, EditPageItem, AddPageItem, \
+ ApproveModerationEditPageItem, RejectModerationEditPageItem
from wagtail.wagtailcore import hooks
register = template.Library()
@@ -50,12 +50,16 @@ def wagtailuserbar(context):
if revision_id is None:
items = [
+ AdminItem(),
EditPageItem(Page.objects.get(id=page.id)),
+ ExplorePageItem(Page.objects.get(id=page.id)),
AddPageItem(Page.objects.get(id=page.id)),
]
else:
items = [
+ AdminItem(),
EditPageItem(PageRevision.objects.get(id=revision_id).page),
+ ExplorePageItem(PageRevision.objects.get(id=revision_id).page),
AddPageItem(PageRevision.objects.get(id=revision_id).page),
ApproveModerationEditPageItem(PageRevision.objects.get(id=revision_id)),
RejectModerationEditPageItem(PageRevision.objects.get(id=revision_id)),
diff --git a/wagtail/wagtailadmin/userbar.py b/wagtail/wagtailadmin/userbar.py
index 1629b80794..8535023610 100644
--- a/wagtail/wagtailadmin/userbar.py
+++ b/wagtail/wagtailadmin/userbar.py
@@ -8,6 +8,18 @@ class BaseItem(object):
return render_to_string(self.template, dict(self=self, request=request), request=request)
+class AdminItem(BaseItem):
+ template = 'wagtailadmin/userbar/item_admin.html'
+
+ def render(self, request):
+
+ # Don't render if user doesn't have permission to access the admin area
+ if not request.user.has_perm('wagtailadmin.access_admin'):
+ return ""
+
+ return super(AdminItem, self).render(request)
+
+
class AddPageItem(BaseItem):
template = 'wagtailadmin/userbar/item_page_add.html'
@@ -32,6 +44,30 @@ class AddPageItem(BaseItem):
return super(AddPageItem, self).render(request)
+class ExplorePageItem(BaseItem):
+ template = 'wagtailadmin/userbar/item_page_explore.html'
+
+ def __init__(self, page):
+ self.page = page
+ self.parent_page = page.get_parent()
+
+ def render(self, request):
+ # Don't render if the page doesn't have an id
+ if not self.page.id:
+ return ""
+
+ # Don't render if user doesn't have permission to access the admin area
+ if not request.user.has_perm('wagtailadmin.access_admin'):
+ return ""
+
+ # Don't render if the user doesn't have permission to edit this page
+ permission_checker = self.page.permissions_for_user(request.user)
+ if not permission_checker.can_edit():
+ return ""
+
+ return super(ExplorePageItem, self).render(request)
+
+
class EditPageItem(BaseItem):
template = 'wagtailadmin/userbar/item_page_edit.html'