diff --git a/apps/addons/models.py b/apps/addons/models.py
index 6f37702f45..27caa3bf3f 100644
--- a/apps/addons/models.py
+++ b/apps/addons/models.py
@@ -1104,6 +1104,9 @@ class Addon(amo.models.OnChangeMixin, amo.models.ModelBase):
def is_pending(self):
return self.status == amo.STATUS_PENDING
+ def is_rejected(self):
+ return self.status == amo.STATUS_REJECTED
+
def can_become_premium(self):
"""
Not all addons can become premium and those that can only at
diff --git a/apps/addons/templates/addons/persona_preview.html b/apps/addons/templates/addons/persona_preview.html
index 95dc3817c3..def32f6afb 100644
--- a/apps/addons/templates/addons/persona_preview.html
+++ b/apps/addons/templates/addons/persona_preview.html
@@ -1,13 +1,22 @@
-
+
{% set tag = 'a' if linked else 'div' %}
{% with addon_url = url_ or addon.get_url_path() %}
<{{ tag }} {% if linked %}href="{{ addon_url }}" target="_self"{% endif %}
{% endwith %}
style="background-image:url('{{ preview }}')"
data-browsertheme="{{ persona.json_data }}">
- {% if extra == 'created' %}
+ {% if request.check_ownership(addon, require_owner=True, admin=False) %}
+ {% if addon.is_unreviewed() %}
+
{{ _('Awaiting Review') }}
+ {% elif addon.is_rejected() %}
+
{{ _('Rejected') }}
+ {% elif addon.is_public() %}
+
{{ _('Approved') }}
+ {% endif %}
+
+ {% elif extra == 'created' %}
{{ _('Added {0}')|f(addon.created|datetime) }}
@@ -30,8 +39,25 @@
{% if caption %}
{{ _('Hover to Preview') }}
{% endif %}
+ {% if linked %}
+
+
+
+
+
+
+
{{ _('Add') }}
+
+
+
+ {% endif %}
{{ tag }}>
+ {% if request.check_ownership(addon, require_owner=True, admin=False) %}
+
+
+
+ {% endif %}
+
{% if details %}
@@ -53,11 +79,6 @@
{% endif %}
-
- {% if linked %}
- {# TODO persona install button on hover #}
-
- {% endif %}
diff --git a/media/css/impala/personas.less b/media/css/impala/personas.less
index aae6b3cd58..1c17e0fb03 100644
--- a/media/css/impala/personas.less
+++ b/media/css/impala/personas.less
@@ -404,3 +404,7 @@ ul.license {
}
}
}
+
+.review-decal, .artist-tools {
+ display: none;
+}
diff --git a/media/css/zamboni/zamboni.css b/media/css/zamboni/zamboni.css
index 78d714d709..36530f27fc 100644
--- a/media/css/zamboni/zamboni.css
+++ b/media/css/zamboni/zamboni.css
@@ -692,7 +692,12 @@ a.button.concealed:active {
}
.button.add b { background-position: 25% 0; }
-.button.add.prominent b { background-position: 25% -49px; }
+.button.add.prominent b {
+ background-position: 25% -49px;
+ position: relative;
+ right: 1px;
+ top: 2px;
+}
.button.download b { background-position: 25% -100px; }
.button.download.prominent b { background-position: 25% -150px; }
.button.add.caution b { background-position: 25% -400px; }
@@ -1089,9 +1094,73 @@ ul.license li.copyr { background-position: 0 -260px; }
.persona-hover .persona-inner {
background: #c8e8f2;
}
+.persona-install {
+ border: 0.25em solid #C8E8F2;
+ bottom: -3px;
+ display: none;
+ left: 0;
+ position: absolute;
+}
+.addons-column .persona-install {
+ left: -3px;
+}
+.with-details .persona-install {
+ bottom: 53px;
+}
+.persona-preview:hover .incompat-browser {
+ display: block;
+}
+.persona-install.incompat-browser {
+ left: 1px;
+}
+.addons-column .persona-install.incompat-browser {
+ left: -2px;
+}
+.persona-install button {
+ border-radius: 1px;
+ height: 25px;
+ width: 65px;
+}
+.persona .persona-install.incompat-browser button.disabled {
+ background: #fff;
+ border-color: #888;
+ text-shadow: none;
+}
+.persona-install.incompat-browser button img {
+ display: none;
+}
+.persona-install button .disabled-icon {
+ display: none;
+}
+.persona-install button span {
+ border-left: 0;
+ border-right: 0;
+ margin: 0;
+ padding: 0;
+ white-space: inherit;
+}
+.persona-install.incompat-browser button:hover {
+ cursor: default;
+}
+.persona-install.incompat-browser button .disabled-icon {
+ display: inline;
+}
+.persona-install button div {
+ bottom: 2px;
+ position: relative;
+}
+.persona-install button div img {
+ border: 0;
+ margin: 0;
+ padding: 0;
+}
.persona-hover .persona-install {
display: block;
}
+#more-personas .persona-install {
+ bottom: 0;
+ left: 0;
+}
.persona-preview {
position: relative;
display: block;
@@ -1102,6 +1171,66 @@ ul.license li.copyr { background-position: 0 -260px; }
background: transparent no-repeat right top;
border: .25em solid #c8e8f2 !important;
}
+.persona-preview span.review-decal {
+ border-radius: 0 0 1px 0;
+ font-weight: normal;
+ left: 3px;
+ padding: 3px 5px;
+ top: 3px;
+}
+.addons-column .persona-preview .review-decal {
+ left: 0;
+ top: 0;
+}
+.review-decal:hover {
+ cursor: pointer;
+}
+.persona-hover .review-decal {
+ background: #fff;
+}
+.persona-preview .approved {
+ color: #339900;
+}
+.persona-preview .rejected {
+ color: red;
+}
+.persona-preview .artist-tools {
+ background: #F5F5F5;
+ border-radius: 1px 0 0 0;
+ bottom: 0;
+ display: none;
+ opacity: .95;
+ padding: 4px 8px;
+ position: absolute;
+ right: 0;
+}
+.with-details .artist-tools {
+ bottom: 54px;
+}
+.persona-hover .artist-tools {
+ display: inline-block;
+}
+.persona-preview .artist-tools:hover {
+ opacity: 1;
+}
+.persona-inner .persona-preview span.artist-tools a {
+ padding: 0;
+ min-height: 0;
+}
+.persona-inner .persona-preview span.artist-tools a:hover {
+ background: none;
+}
+.persona-preview .artist-tools img {
+ height: 18px;
+ width: 18px;
+}
+.artist-tools.incompat-browser {
+ bottom: 55px;
+ right: 3px;
+}
+.addons-column .artist-tools.incompat-browser {
+ bottom: 3px;
+}
.persona-hover .persona-preview [data-browsertheme] {
border-color: #fff !important;
}
@@ -1121,7 +1250,8 @@ ul.license li.copyr { background-position: 0 -260px; }
.persona-preview .created,
.persona-preview .users,
-.persona-preview .reviews {
+.persona-preview .reviews,
+.persona-preview .review-decal {
background-color: #c8e8f2;
display: inline-block;
padding: .25em .5em;
@@ -1140,7 +1270,8 @@ ul.license li.copyr { background-position: 0 -260px; }
.persona-hover .created,
.persona-hover .users,
-.persona-hover .reviews {
+.persona-hover .reviews,
+.persona-hover .review-decal {
background-color: #fff;
}
diff --git a/media/js/zamboni/personas.js b/media/js/zamboni/personas.js
index 28dcb452ee..a14653d220 100644
--- a/media/js/zamboni/personas.js
+++ b/media/js/zamboni/personas.js
@@ -14,6 +14,18 @@ function initPreviewTheme(mktTheme) {
return;
}
+ if (BrowserUtils().browser.firefox !== true) {
+ $('.artist-tools, .persona-install').addClass('incompat-browser');
+ $('.persona-install button').addClass('disabled');
+ }
+
+ // Hover thumbnail install buttons.
+ $('.persona-install .add').click(_pd(function(e) {
+ dispatchPersonaEvent(
+ 'SelectPersona',
+ $(this).closest('.persona').find('.persona-preview a')[0]);
+ }));
+
if (mktTheme === true) {
z.mktThemeFlag = true;
bindPreviewListeners($themes);
@@ -54,7 +66,7 @@ $.fn.previewPersona = function(o) {
}
o = $.extend({
resetOnClick: true,
- activeClass: 'persona-hover'
+ activeClass: 'persona-hover'
}, o || {});
var $this = $(this);
if (o.resetOnClick) {