dark board theme WIP
parent
76f8ab418d
commit
71e57c16eb
|
@ -221,7 +221,7 @@ object layout {
|
|||
rel := "alternate",
|
||||
st.title := trans.blog.txt()
|
||||
),
|
||||
ctx.transpBgImg map { img =>
|
||||
ctx.currentBg == "transp" option ctx.pref.bgImgOrDefault map { img =>
|
||||
raw(
|
||||
s"""<style id="bg-data">body.transp::before{background-image:url('$img');}</style>"""
|
||||
)
|
||||
|
@ -233,6 +233,7 @@ object layout {
|
|||
st.body(
|
||||
cls := List(
|
||||
s"${ctx.currentBg} ${ctx.currentTheme.cssClass} ${ctx.currentTheme3d.cssClass} ${ctx.currentPieceSet3d.toString} coords-${ctx.pref.coordsClass}" -> true,
|
||||
"dark-board" -> (ctx.pref.bg == lila.pref.Pref.Bg.DARKBOARD),
|
||||
"piece-letter" -> ctx.pref.pieceNotationIsLetter,
|
||||
"zen" -> ctx.pref.isZen,
|
||||
"blind-mode" -> ctx.blind,
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
db.pref.find({dark:{$exists:1}}, {dark:1,transp:1}).forEach(p => {
|
||||
const bg = p.dark ? (p.transp ? 400 : 300) : 100;
|
||||
db.pref.update({_id: p._id}, {$set:{bg: bg},$unset:{dark:1,transp:1}});
|
||||
});
|
|
@ -1,7 +1,7 @@
|
|||
package lila.api
|
||||
|
||||
import play.api.mvc.RequestHeader
|
||||
import play.api.i18n.Lang
|
||||
import play.api.mvc.RequestHeader
|
||||
|
||||
import lila.common.{ HTTPRequest, Nonce }
|
||||
import lila.pref.Pref
|
||||
|
@ -64,9 +64,10 @@ sealed trait Context extends lila.user.UserContextWrapper {
|
|||
|
||||
def currentSoundSet = lila.pref.SoundSet(pref.soundSet)
|
||||
|
||||
lazy val currentBg = if (pref.transp) "transp" else if (pref.dark) "dark" else "light"
|
||||
|
||||
def transpBgImg = currentBg == "transp" option pref.bgImgOrDefault
|
||||
lazy val currentBg =
|
||||
if (pref.bg == Pref.Bg.TRANSPARENT) "transp"
|
||||
else if (pref.bg == Pref.Bg.LIGHT) "light"
|
||||
else "dark"
|
||||
|
||||
lazy val mobileApiVersion = Mobile.Api requestVersion req
|
||||
|
||||
|
|
|
@ -6,8 +6,8 @@ object JsonView {
|
|||
|
||||
implicit val prefJsonWriter = OWrites[Pref] { p =>
|
||||
Json.obj(
|
||||
"dark" -> p.dark,
|
||||
"transp" -> p.transp,
|
||||
"dark" -> (p.bg != Pref.Bg.LIGHT),
|
||||
"transp" -> (p.bg == Pref.Bg.TRANSPARENT),
|
||||
"bgImg" -> p.bgImgOrDefault,
|
||||
"is3d" -> p.is3d,
|
||||
"theme" -> p.theme,
|
||||
|
|
|
@ -2,8 +2,7 @@ package lila.pref
|
|||
|
||||
case class Pref(
|
||||
_id: String, // user id
|
||||
dark: Boolean,
|
||||
transp: Boolean,
|
||||
bg: Int,
|
||||
bgImg: Option[String],
|
||||
is3d: Boolean,
|
||||
theme: String,
|
||||
|
@ -52,7 +51,7 @@ case class Pref(
|
|||
def realTheme3d = Theme3d(theme3d)
|
||||
def realPieceSet3d = PieceSet3d(pieceSet3d)
|
||||
|
||||
def themeColor = if (transp || dark) "#2e2a24" else "#dbd7d1"
|
||||
def themeColor = if (bg == Bg.LIGHT) "#dbd7d1" else "#2e2a24"
|
||||
|
||||
def realSoundSet = SoundSet(soundSet)
|
||||
|
||||
|
@ -63,9 +62,7 @@ case class Pref(
|
|||
|
||||
def set(name: String, value: String): Option[Pref] =
|
||||
name match {
|
||||
case "bg" =>
|
||||
if (value == "transp") copy(dark = true, transp = true).some
|
||||
else copy(dark = value == "dark", transp = false).some
|
||||
case "bg" => value.toIntOption.map { bg => copy(bg = bg) }
|
||||
case "bgImg" => copy(bgImg = value.some).some
|
||||
case "theme" =>
|
||||
Theme.allByName get value map { t =>
|
||||
|
@ -135,6 +132,27 @@ object Pref {
|
|||
val verify = (v: Int) => v == 0 || v == 1
|
||||
}
|
||||
|
||||
object Bg {
|
||||
val LIGHT = 100
|
||||
val DARK = 200
|
||||
val DARKBOARD = 300
|
||||
val TRANSPARENT = 400
|
||||
|
||||
val choices = Seq(
|
||||
LIGHT -> "Light",
|
||||
DARK -> "Dark",
|
||||
DARKBOARD -> "Dark Board",
|
||||
TRANSPARENT -> "Transparent"
|
||||
)
|
||||
|
||||
val fromString = Map(
|
||||
"light" -> LIGHT,
|
||||
"dark" -> LIGHT,
|
||||
"darkBoard" -> DARKBOARD,
|
||||
"transp" -> TRANSPARENT
|
||||
)
|
||||
}
|
||||
|
||||
object Tag {
|
||||
val verifyTitle = "verifyTitle"
|
||||
}
|
||||
|
@ -383,8 +401,7 @@ object Pref {
|
|||
|
||||
lazy val default = Pref(
|
||||
_id = "",
|
||||
dark = false,
|
||||
transp = false,
|
||||
bg = Bg.LIGHT,
|
||||
bgImg = none,
|
||||
is3d = false,
|
||||
theme = Theme.default.name,
|
||||
|
|
|
@ -12,8 +12,7 @@ private object PrefHandlers {
|
|||
def reads(r: BSON.Reader): Pref =
|
||||
Pref(
|
||||
_id = r str "_id",
|
||||
dark = r.getD("dark", Pref.default.dark),
|
||||
transp = r.getD("transp", Pref.default.transp),
|
||||
bg = r.getD("bg", Pref.default.bg),
|
||||
bgImg = r.strO("bgImg"),
|
||||
is3d = r.getD("is3d", Pref.default.is3d),
|
||||
theme = r.getD("theme", Pref.default.theme),
|
||||
|
@ -56,8 +55,7 @@ private object PrefHandlers {
|
|||
def writes(w: BSON.Writer, o: Pref) =
|
||||
$doc(
|
||||
"_id" -> o._id,
|
||||
"dark" -> o.dark,
|
||||
"transp" -> o.transp,
|
||||
"bg" -> o.bg,
|
||||
"bgImg" -> o.bgImg,
|
||||
"is3d" -> o.is3d,
|
||||
"theme" -> o.theme,
|
||||
|
|
|
@ -7,11 +7,8 @@ object RequestPref {
|
|||
import Pref.default
|
||||
|
||||
def queryParamOverride(req: RequestHeader)(pref: Pref): Pref =
|
||||
queryParam(req, "bg").fold(pref) { bg =>
|
||||
pref.copy(
|
||||
dark = bg != "light",
|
||||
transp = bg == "transp"
|
||||
)
|
||||
queryParam(req, "bg").flatMap(Pref.Bg.fromString.get).fold(pref) { bg =>
|
||||
pref.copy(bg = bg)
|
||||
}
|
||||
|
||||
def fromRequest(req: RequestHeader): Pref = {
|
||||
|
@ -19,11 +16,8 @@ object RequestPref {
|
|||
def paramOrSession(name: String): Option[String] =
|
||||
queryParam(req, name) orElse req.session.get(name)
|
||||
|
||||
val bg = paramOrSession("bg") | "light"
|
||||
|
||||
default.copy(
|
||||
dark = bg != "light",
|
||||
transp = bg == "transp",
|
||||
bg = paramOrSession("bg").flatMap(Pref.Bg.fromString.get) | default.bg,
|
||||
theme = paramOrSession("theme") | default.theme,
|
||||
theme3d = req.session.data.getOrElse("theme3d", default.theme3d),
|
||||
pieceSet = req.session.data.getOrElse("pieceSet", default.pieceSet),
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
@import "board-2d";
|
||||
@import "dark-board";
|
||||
|
||||
cg-board {
|
||||
@extend %box-shadow, %abs-100;
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
@if $theme-dark {
|
||||
body.dark-board {
|
||||
--dark-factor: 0.4;
|
||||
|
||||
cg-board {
|
||||
background-color: rgba(0, 0, 0, var(--dark-factor));
|
||||
background-blend-mode: darken;
|
||||
}
|
||||
|
||||
&.coords-in coord {
|
||||
color: #fff !important;
|
||||
opacity: calc(1 - var(--dark-factor));
|
||||
}
|
||||
|
||||
cg-board square {
|
||||
opacity: calc(1 - var(--dark-factor));
|
||||
}
|
||||
|
||||
cg-board piece {
|
||||
filter: brightness(calc(1 - 0.6 * var(--dark-factor)));
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue