Merge branch 'master' of github.com:ornicar/lila
* 'master' of github.com:ornicar/lila: Restyle messages drop-down. Remove JS link on Challenge Notif
This commit is contained in:
Thibault Duplessis
commit
e9d097e523
|
|
@ -203,6 +203,32 @@ trait UserHelper { self: I18nHelper with StringHelper =>
|
|||
Html(s"""<a$dataIcon $klass $href>$space$titleS$content</a>""")
|
||||
}
|
||||
|
||||
def userSpan(
|
||||
user: User,
|
||||
cssClass: Option[String] = None,
|
||||
withOnline: Boolean = true,
|
||||
withPowerTip: Boolean = true,
|
||||
withTitle: Boolean = true,
|
||||
withBestRating: Boolean = false,
|
||||
withPerfRating: Option[PerfType] = None,
|
||||
text: Option[String] = None) = Html {
|
||||
val klass = userClass(user.id, cssClass, withOnline, withPowerTip)
|
||||
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 =>
|
||||
s" ($rating)"
|
||||
} getOrElse {
|
||||
withBestRating ?? {
|
||||
user.perfs.bestPerf ?? {
|
||||
case (pt, perf) => s" ${showPerfRating(pt, perf, "hint--bottom")}"
|
||||
}
|
||||
}
|
||||
}
|
||||
s"""<span$dataIcon $klass>$space$titleS$content$rating</span>"""
|
||||
}
|
||||
|
||||
private def userHref(username: String, params: String = "") =
|
||||
s"""href="${routes.User.show(username)}$params""""
|
||||
|
||||
|
|
|
|||
|
|
@ -180,10 +180,16 @@ openGraph: Map[Symbol, String] = Map.empty)(body: Html)(implicit ctx: Context)
|
|||
<div class="ping">PING <strong>?</strong> ms</div>
|
||||
</div>
|
||||
</div>
|
||||
<a data-href="@routes.Message.preview" class="goto_nav message blank_if_play @{(active exists (_.code == "message")).??("current")}" href="@routes.Message.inbox(page=1)">
|
||||
<span class="is2" data-icon="e"></span>
|
||||
<span id="nb_messages" class="new_messages@if(ctx.nbMessages > 0) { unread}">@ctx.nbMessages</span>
|
||||
</a>
|
||||
<div id="message_notifications_parent" class="message_notifications">
|
||||
<a id="message_notifications_tag" class="toggle toggle_message_notifications" 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>
|
||||
</div>
|
||||
<div class="challenge_notifications">
|
||||
<a id="challenge_notifications_tag" class="toggle toggle_challenge_notifications">
|
||||
<span data-icon="U"></span>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,23 @@
|
|||
@(me: User, threads: List[lila.message.Thread])(implicit ctx: Context)
|
||||
|
||||
@if(threads.nonEmpty) {
|
||||
<table><tbody>
|
||||
@threads.distinct.map { thread =>
|
||||
<tr>
|
||||
<td>
|
||||
<a data-icon="c" class="revert-underline" href="@routes.Message.thread(thread.id)">
|
||||
@thread.name
|
||||
<strong>@usernameOrId(thread otherUserId me)</strong>
|
||||
@thread.firstPostUnreadBy(me).map(p => shorten(p.text, 100))
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<a class="button mark_as_read hint--bottom" data-hint="Mark as read" href="@routes.Message.markAsRead(thread.id)">
|
||||
<span data-icon="E"></span>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<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>
|
||||
</div>
|
||||
<a href="@routes.Message.thread(thread.id)">
|
||||
<span class="inner">
|
||||
<span class="message_infos" data-icon="c">
|
||||
<span class="header">
|
||||
<strong>@usernameOrId(thread otherUserId me)</strong> • @thread.name
|
||||
<span class="content">
|
||||
@thread.firstPostUnreadBy(me).map(p => shorten(p.text, 100))
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
}
|
||||
</tbody></table>
|
||||
} else {
|
||||
@trans.noNewMessages()
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,26 +1,28 @@
|
|||
@(g: Game, user: User)
|
||||
|
||||
<div id="challenge_reminder_@g.id" data-href="@routes.Round.watcher(g.id, "white")" class="notification challenge_reminder">
|
||||
<div class="inner">
|
||||
<div class="actions">
|
||||
<a class="action decline" href="@routes.Setup.decline(g.id)" data-icon="L"></a>
|
||||
</div>
|
||||
<div class="game_infos" data-icon="@g.perfType match {
|
||||
case _ if g.fromPosition => {*}
|
||||
case Some(p) => {@p.iconChar}
|
||||
case _ => {8}
|
||||
}">
|
||||
<div class="header">
|
||||
@userLink(user, withOnline = false, withPerfRating = g.perfType, cssClass = "disabled".some)<br />
|
||||
<span class="setup">
|
||||
@g.clock.map(_.show).getOrElse {∞} •
|
||||
@if(g.variant.exotic) {
|
||||
@(if (g.variant == chess.Variant.KingOfTheHill) g.variant.shortName else g.variant.name)
|
||||
} else {
|
||||
@g.perfType.map(_.name)
|
||||
} • @g.rated.fold(trans.rated.en(), trans.casual.en())
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<a class="action decline" href="@routes.Setup.decline(g.id)" data-icon="L"></a>
|
||||
</div>
|
||||
<a href="@routes.Round.watcher(g.id, "white")">
|
||||
<span class="inner">
|
||||
<span class="game_infos" data-icon="@g.perfType match {
|
||||
case _ if g.fromPosition => {*}
|
||||
case Some(p) => {@p.iconChar}
|
||||
case _ => {8}
|
||||
}">
|
||||
<span class="header">
|
||||
@userSpan(user, withOnline = false, withPerfRating = g.perfType, withPowerTip = false)
|
||||
<span class="setup">
|
||||
@g.clock.map(_.show).getOrElse {∞} •
|
||||
@if(g.variant.exotic) {
|
||||
@(if (g.variant == chess.Variant.KingOfTheHill) g.variant.shortName else g.variant.name)
|
||||
} else {
|
||||
@g.perfType.map(_.name)
|
||||
} • @g.rated.fold(trans.rated.en(), trans.casual.en())
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -175,10 +175,6 @@ var storage = {
|
|||
nbChallengesAdd();
|
||||
$('#challenge_notifications').append(data.html);
|
||||
$notif = $('#' + htmlId);
|
||||
$notif.add($notif.find("a.disabled")).on('click', function() {
|
||||
location.href = $notif.data('href');
|
||||
return false;
|
||||
});
|
||||
declineListener($notif.find('a.decline'));
|
||||
$('body').trigger('lichess.content_loaded');
|
||||
if (!storage.get('challenge-' + data.id)) {
|
||||
|
|
@ -323,26 +319,22 @@ var storage = {
|
|||
setTimeout(userPowertips, 600);
|
||||
$('body').on('lichess.content_loaded', userPowertips);
|
||||
|
||||
$('#top a.message').powerTip({
|
||||
placement: 'sw',
|
||||
mouseOnToPopup: true,
|
||||
closeDelay: 200
|
||||
}).on({
|
||||
powerTipPreRender: function() {
|
||||
$.ajax({
|
||||
url: $(this).data('href'),
|
||||
success: function(html) {
|
||||
$('#powerTip').html(html).addClass('messages').find('a.mark_as_read').click(function() {
|
||||
$.ajax({
|
||||
url: $(this).attr('href'),
|
||||
method: 'post'
|
||||
});
|
||||
return false;
|
||||
$('#message_notifications_tag').on('click', function() {
|
||||
$.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'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}).data('powertip', ' ');
|
||||
$('#message_notifications_parent').toggleClass("shown", false);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function setMoment() {
|
||||
$("time.moment").removeClass('moment').each(function() {
|
||||
|
|
|
|||
|
|
@ -804,6 +804,7 @@ div.side_box .top {
|
|||
div.side_box .padded {
|
||||
padding: 7px;
|
||||
}
|
||||
.notification .message_infos,
|
||||
.notification .game_infos,
|
||||
div.side_box .game_infos {
|
||||
padding-left: 36px;
|
||||
|
|
@ -814,6 +815,7 @@ div.side_box .game_infos {
|
|||
padding-bottom: 8px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.notification .message_infos::before,
|
||||
.notification .game_infos::before,
|
||||
div.side_box .game_infos::before {
|
||||
position: absolute;
|
||||
|
|
@ -958,15 +960,18 @@ body.offline #nb_connected_players {
|
|||
#user_tag {
|
||||
font-weight: bold;
|
||||
}
|
||||
#top div.message_notifications,
|
||||
#top div.challenge_notifications,
|
||||
#top div.auth {
|
||||
float: right;
|
||||
position: relative;
|
||||
}
|
||||
#top div.message_notifications.shown .links,
|
||||
#top div.challenge_notifications.shown .links,
|
||||
#top div.auth.shown .links {
|
||||
display: block;
|
||||
}
|
||||
#top div.message_notificatiosn .links > a,
|
||||
#top div.challenge_notifications .links > a,
|
||||
#top div.auth .links > a {
|
||||
display: block;
|
||||
|
|
@ -998,22 +1003,40 @@ body.offline #nb_connected_players {
|
|||
display: block;
|
||||
padding: 5px 10px 10px 10px;
|
||||
}
|
||||
#top #message_notifications_tag span:before,
|
||||
#top #challenge_notifications_tag span:before {
|
||||
font-size: 1.45em;
|
||||
padding-left: 3px;
|
||||
}
|
||||
#top div.message_notifications div.title {
|
||||
padding: 5px 3% 5px 3%;
|
||||
text-align: center;
|
||||
width: 200px;
|
||||
}
|
||||
#top div.message_notifications div.title a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
#top #challenge_notifications div.title {
|
||||
padding: 5px 3% 5px 3%;
|
||||
text-align: center;
|
||||
}
|
||||
#message_notifications div.notification,
|
||||
#challenge_notifications div.notification {
|
||||
cursor: pointer;
|
||||
border-top: 1px solid #c0c0c0;
|
||||
padding: 6px 8px 7px 8px;
|
||||
position: relative;
|
||||
}
|
||||
#message_notifications div.notification:hover,
|
||||
#challenge_notifications div.notification:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
#message_notifications span.inner,
|
||||
#challenge_notifications span.inner {
|
||||
display: block;
|
||||
width: calc(100% - 15px);
|
||||
height: 100%;
|
||||
padding: 6px 8px 7px 8px;
|
||||
}
|
||||
#message_notifications,
|
||||
#challenge_notifications,
|
||||
#notifications {
|
||||
position: absolute;
|
||||
|
|
@ -1039,37 +1062,49 @@ body.offline #nb_connected_players {
|
|||
line-height: inherit;
|
||||
height: auto;
|
||||
}
|
||||
#challenge_notifications > div a.close,
|
||||
#notifications > div a.close {
|
||||
text-decoration: none;
|
||||
float: right;
|
||||
}
|
||||
#challenge_notifications > div a.close:hover,
|
||||
#notifications > div a.close:hover {
|
||||
font-weight: bold;
|
||||
}
|
||||
#challenge_notifications .user_link {
|
||||
font-weight: bold;
|
||||
}
|
||||
#message_notifications_display .content,
|
||||
#challenge_notifications .setup {
|
||||
display: block;
|
||||
margin-left: 37px;
|
||||
margin-bottom: -18px;
|
||||
}
|
||||
#challenge_notifications .setup {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
#message_notifications .actions,
|
||||
#challenge_notifications .actions,
|
||||
#notifications .actions {
|
||||
position: relative;
|
||||
float: right;
|
||||
z-index: 4;
|
||||
text-decoration: none;
|
||||
}
|
||||
#challenge_notifications a,
|
||||
#message_notifications a,
|
||||
#challenge_notifications a {
|
||||
text-decoration: none;
|
||||
}
|
||||
#notifications a {
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
}
|
||||
#challenge_notifications .actions a,
|
||||
#message_notifications .actions a,
|
||||
#challenge_notifications .actions a {
|
||||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
}
|
||||
#notifications .actions a {
|
||||
margin-left: 10px;
|
||||
}
|
||||
#message_notifications .actions a:hover,
|
||||
#challenge_notifications .actions a:hover,
|
||||
#notifications .actions a:hover {
|
||||
color: #d85000;
|
||||
|
|
|
|||
|
|
@ -125,7 +125,8 @@ body.dark div.training div.box,
|
|||
body.dark div.force_resign_zone,
|
||||
body.dark div.negotiation,
|
||||
body.dark div.side_box div.game_infos,
|
||||
body.dark #challenge_notifications > div.notification {
|
||||
body.dark #challenge_notifications div.notification,
|
||||
body.dark #message_notifications div.notification {
|
||||
border-color: #3d3d3d;
|
||||
}
|
||||
body.dark .crosstable td.last {
|
||||
|
|
@ -144,7 +145,8 @@ body.dark #hooks_wrap > div.tabs > a,
|
|||
body.dark #top div.auth .links a:hover,
|
||||
body.dark #top ul.language_links a:hover,
|
||||
body.dark #top ul.language_links a.current,
|
||||
body.dark #challenge_notifications > div.notification:hover {
|
||||
body.dark #challenge_notifications > div.notification:hover,
|
||||
body.dark #message_notifications div.notification:hover {
|
||||
background-color: #3e3e3e;
|
||||
color: #b0b0b0;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue