tweak challenges and messages previews
This commit is contained in:
parent
8a54cbdcf0
commit
dbae11c77d
|
@ -174,15 +174,7 @@ trait UserHelper { self: I18nHelper with StringHelper =>
|
|||
val titleS = if (withTitle) titleTag(user.title) else ""
|
||||
val space = if (withOnline) " " else ""
|
||||
val dataIcon = if (withOnline) """ data-icon="r"""" else ""
|
||||
val rating = withPerfRating map (_.key) flatMap user.perfs.ratingOf map { rating =>
|
||||
s" ($rating)"
|
||||
} getOrElse {
|
||||
withBestRating ?? {
|
||||
user.perfs.bestPerf ?? {
|
||||
case (pt, perf) => s" ${showPerfRating(pt, perf, "hint--bottom")}"
|
||||
}
|
||||
}
|
||||
}
|
||||
val rating = userRating(user, withPerfRating, withBestRating)
|
||||
s"""<a$dataIcon $klass $href>$space$titleS$content$rating</a>"""
|
||||
}
|
||||
|
||||
|
@ -213,11 +205,26 @@ trait UserHelper { self: I18nHelper with StringHelper =>
|
|||
withPerfRating: Option[PerfType] = None,
|
||||
text: Option[String] = None) = Html {
|
||||
val klass = userClass(user.id, cssClass, withOnline, withPowerTip)
|
||||
val href = s"data-${userHref(user.username)}"
|
||||
val content = text | user.username
|
||||
val titleS = if (withTitle) titleTag(user.title) else ""
|
||||
val space = if (withOnline) " " else ""
|
||||
val dataIcon = if (withOnline) """ data-icon="r"""" else ""
|
||||
val rating = withPerfRating map (_.key) flatMap user.perfs.ratingOf map { rating =>
|
||||
val rating = userRating(user, withPerfRating, withBestRating)
|
||||
s"""<span$dataIcon $klass $href>$space$titleS$content$rating</span>"""
|
||||
}
|
||||
|
||||
def userIdSpanMini(userId: String) = Html {
|
||||
val user = lightUser(userId)
|
||||
val name = user.fold(userId)(_.name)
|
||||
val content = user.fold(userId)(_.titleNameHtml)
|
||||
val klass = userClass(userId, none, false)
|
||||
val href = s"data-${userHref(name)}"
|
||||
s"""<span $klass $href>$content</span>"""
|
||||
}
|
||||
|
||||
private def userRating(user: User, withPerfRating: Option[PerfType], withBestRating: Boolean) =
|
||||
withPerfRating map (_.key) flatMap user.perfs.ratingOf map { rating =>
|
||||
s" ($rating)"
|
||||
} getOrElse {
|
||||
withBestRating ?? {
|
||||
|
@ -226,8 +233,6 @@ trait UserHelper { self: I18nHelper with StringHelper =>
|
|||
}
|
||||
}
|
||||
}
|
||||
s"""<span$dataIcon $klass>$space$titleS$content$rating</span>"""
|
||||
}
|
||||
|
||||
private def userHref(username: String, params: String = "") =
|
||||
s"""href="${routes.User.show(username)}$params""""
|
||||
|
|
|
@ -181,23 +181,21 @@ openGraph: Map[Symbol, String] = Map.empty)(body: Html)(implicit ctx: Context)
|
|||
</div>
|
||||
</div>
|
||||
<div id="message_notifications_parent" class="message_notifications">
|
||||
<a id="message_notifications_tag" class="toggle toggle_message_notifications" data-href="@routes.Message.preview">
|
||||
<a id="message_notifications_tag" class="toggle" data-href="@routes.Message.preview">
|
||||
<span data-icon="e"></span>
|
||||
<span id="nb_messages" class="new_messages@if(ctx.nbMessages > 0) { unread}">@ctx.nbMessages</span>
|
||||
</a>
|
||||
<div id="message_notifications" class="links dropdown">
|
||||
<div class="title">New messages (<a href="@routes.Message.inbox(page=1)">view all</a>)</div>
|
||||
<div id="message_notifications_display" class="content"> </div>
|
||||
<div id="message_notifications_display" class="content"></div>
|
||||
<div class="title"><a href="@routes.Message.inbox(page=1)">@trans.inbox() »</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="challenge_notifications">
|
||||
<a id="challenge_notifications_tag" class="toggle toggle_challenge_notifications">
|
||||
<a id="challenge_notifications_tag" class="toggle none">
|
||||
<span data-icon="U"></span>
|
||||
<span id="nb_challenges" class="new_challenges">0</span>
|
||||
<span id="nb_challenges" class="new_challenges unread">0</span>
|
||||
</a>
|
||||
<div id="challenge_notifications" class="links dropdown">
|
||||
<div class="title">Pending challenges</div>
|
||||
</div>
|
||||
<div id="challenge_notifications" class="links dropdown"></div>
|
||||
</div>
|
||||
}.getOrElse {
|
||||
<a href="@routes.Auth.login" class="signin button" data-icon="F"> @trans.signIn()</a>
|
||||
|
|
|
@ -4,11 +4,12 @@
|
|||
@threads.distinct.map { thread =>
|
||||
<div class="notification message_reminder">
|
||||
<div class="actions">
|
||||
<a class="action decline mark_as_read" href="@routes.Message.markAsRead(thread.id)" data-icon="L"></a>
|
||||
<a class="action mark_as_read" href="@routes.Message.markAsRead(thread.id)" data-icon="L"></a>
|
||||
</div>
|
||||
<a class="block" href="@routes.Message.thread(thread.id)">
|
||||
<span class="message_infos" data-icon="c">
|
||||
<strong>@usernameOrId(thread otherUserId me)</strong> • @thread.name
|
||||
@userIdSpanMini(thread.otherUserId(me))
|
||||
• <span class="title">@thread.name</span>
|
||||
<span class="content">
|
||||
@thread.firstPostUnreadBy(me).map(p => shorten(p.text, 100))
|
||||
</span>
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
case Some(p) => {@p.iconChar}
|
||||
case _ => {8}
|
||||
}">
|
||||
@userSpan(user, withOnline = false, withPerfRating = g.perfType, withPowerTip = false)
|
||||
@userSpan(user, withOnline = false, withPerfRating = g.perfType)
|
||||
<span class="setup">
|
||||
@g.clock.map(_.show).getOrElse {∞} •
|
||||
@if(g.variant.exotic) {
|
||||
|
|
|
@ -148,15 +148,10 @@ var storage = {
|
|||
},
|
||||
challengeReminder: function(data) {
|
||||
if (!storage.get('challenge-refused-' + data.id)) {
|
||||
var nbChallenges = function() {
|
||||
var nb = parseInt($('#nb_challenges').text());
|
||||
return nb ? ((nb > 0) ? nb : 0) : 0;
|
||||
};
|
||||
var nbChallengesAdd = function() {
|
||||
$('#nb_challenges').text(nbChallenges() + 1).toggleClass("unread", true);
|
||||
};
|
||||
var nbChallengesMinus = function() {
|
||||
$('#nb_challenges').text(nbChallenges() - 1).toggleClass("unread", nbChallenges() > 0);
|
||||
var refreshButton = function() {
|
||||
var nb = $('#challenge_notifications > div').length;
|
||||
$('#nb_challenges').text(nb);
|
||||
$('#challenge_notifications_tag').toggleClass('none', !nb);
|
||||
};
|
||||
var htmlId = 'challenge_reminder_' + data.id;
|
||||
var $notif = $('#' + htmlId);
|
||||
|
@ -166,13 +161,12 @@ var storage = {
|
|||
storage.set('challenge-refused-' + data.id, 1);
|
||||
$('#' + htmlId).remove();
|
||||
if ($.isFunction(callback)) callback();
|
||||
nbChallengesMinus();
|
||||
refreshButton();
|
||||
return false;
|
||||
});
|
||||
};
|
||||
if ($notif.length) clearTimeout($notif.data('timeout'));
|
||||
else {
|
||||
nbChallengesAdd();
|
||||
$('#challenge_notifications').append(data.html);
|
||||
$notif = $('#' + htmlId);
|
||||
declineListener($notif.find('a.decline'));
|
||||
|
@ -181,6 +175,7 @@ var storage = {
|
|||
$.sound.dong();
|
||||
storage.set('challenge-' + data.id, 1);
|
||||
}
|
||||
refreshButton();
|
||||
}
|
||||
$('div.lichess_overboard.joining.' + data.id).each(function() {
|
||||
$notif.hide();
|
||||
|
@ -192,7 +187,7 @@ var storage = {
|
|||
});
|
||||
$notif.data('timeout', setTimeout(function() {
|
||||
$notif.remove();
|
||||
nbChallengesMinus();
|
||||
refreshButton();
|
||||
}, 3000));
|
||||
}
|
||||
},
|
||||
|
@ -296,7 +291,7 @@ var storage = {
|
|||
|
||||
function userPowertips() {
|
||||
var header = document.getElementById('site_header');
|
||||
$('a.ulpt').removeClass('ulpt').each(function() {
|
||||
$('.ulpt').removeClass('ulpt').each(function() {
|
||||
$(this).powerTip({
|
||||
fadeInTime: 100,
|
||||
fadeOutTime: 100,
|
||||
|
@ -306,7 +301,7 @@ var storage = {
|
|||
}).on({
|
||||
powerTipPreRender: function() {
|
||||
$.ajax({
|
||||
url: $(this).attr('href').replace(/\?.+$/, '') + '/mini',
|
||||
url: ($(this).attr('href') || $(this).data('href')).replace(/\?.+$/, '') + '/mini',
|
||||
success: function(html) {
|
||||
$('#powerTip').html(html);
|
||||
$('body').trigger('lichess.content_loaded');
|
||||
|
@ -323,15 +318,15 @@ var storage = {
|
|||
$.ajax({
|
||||
url: $(this).data('href'),
|
||||
success: function(html) {
|
||||
console.log(html);
|
||||
$('#message_notifications_display').html(html).addClass('messages').find('a.mark_as_read').click(function() {
|
||||
$.ajax({
|
||||
url: $(this).attr('href'),
|
||||
method: 'post'
|
||||
$('#message_notifications_display').html(html)
|
||||
.find('a.mark_as_read').click(function() {
|
||||
$.ajax({
|
||||
url: $(this).attr('href'),
|
||||
method: 'post'
|
||||
});
|
||||
return false;
|
||||
});
|
||||
$('#message_notifications_parent').toggleClass("shown", false);
|
||||
return false;
|
||||
});
|
||||
$('body').trigger('lichess.content_loaded');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
@ -499,7 +499,7 @@ div.content_box .loader:after {
|
|||
display: inline-block;
|
||||
}
|
||||
.none {
|
||||
display: none;
|
||||
display: none!important;
|
||||
}
|
||||
html {
|
||||
min-height: 100%;
|
||||
|
@ -1014,9 +1014,8 @@ body.offline #nb_connected_players {
|
|||
padding-left: 3px;
|
||||
}
|
||||
#top div.message_notifications div.title {
|
||||
padding: 5px 3% 5px 3%;
|
||||
padding: 5px 0;
|
||||
text-align: center;
|
||||
width: 200px;
|
||||
}
|
||||
#top div.message_notifications div.title a {
|
||||
text-decoration: underline;
|
||||
|
@ -1027,7 +1026,8 @@ body.offline #nb_connected_players {
|
|||
}
|
||||
#message_notifications div.notification,
|
||||
#challenge_notifications div.notification {
|
||||
border-top: 1px solid #c0c0c0;
|
||||
border-bottom: 1px solid #c0c0c0;
|
||||
transition: 0.13s;
|
||||
position: relative;
|
||||
}
|
||||
#message_notifications div.notification:hover,
|
||||
|
@ -1067,7 +1067,9 @@ body.offline #nb_connected_players {
|
|||
#notifications > div a.close:hover {
|
||||
font-weight: bold;
|
||||
}
|
||||
#challenge_notifications .user_link {
|
||||
#message_notifications .user_link,
|
||||
#challenge_notifications .user_link,
|
||||
#message_notifications .block .title {
|
||||
font-weight: bold;
|
||||
}
|
||||
#message_notifications_display .content,
|
||||
|
@ -1080,9 +1082,13 @@ body.offline #nb_connected_players {
|
|||
#message_notifications .actions,
|
||||
#challenge_notifications .actions,
|
||||
#notifications .actions {
|
||||
position: relative;
|
||||
float: right;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
z-index: 1;
|
||||
text-decoration: none;
|
||||
opacity: 0;
|
||||
transition: 0.13s;
|
||||
}
|
||||
#message_notifications a,
|
||||
#challenge_notifications a {
|
||||
|
@ -1102,6 +1108,10 @@ body.offline #nb_connected_players {
|
|||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
}
|
||||
#message_notifications .notification:hover .actions,
|
||||
#challenge_notifications .notification:hover .actions {
|
||||
opacity: 0.7;
|
||||
}
|
||||
#notifications .actions a {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
@ -1921,15 +1931,6 @@ input.copyable {
|
|||
padding: 3px 5px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
#powerTip.messages {
|
||||
max-width: 500px;
|
||||
padding: 1em;
|
||||
min-height: 1em;
|
||||
}
|
||||
#powerTip.messages a {
|
||||
padding: 0.6em;
|
||||
display: block;
|
||||
}
|
||||
.flag {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
|
|
Loading…
Reference in a new issue