Milestone 2: Graphic User Interface #93
2 changed files with 146 additions and 30 deletions
|
@ -7,6 +7,7 @@ import Control.Exception (throwIO, try)
|
||||||
import Control.Monad.Logger (runNoLoggingT)
|
import Control.Monad.Logger (runNoLoggingT)
|
||||||
import Data.Maybe (fromMaybe, isJust)
|
import Data.Maybe (fromMaybe, isJust)
|
||||||
import qualified Data.Text as T
|
import qualified Data.Text as T
|
||||||
|
import Data.Time.Clock.POSIX (posixSecondsToUTCTime)
|
||||||
import Database.Persist
|
import Database.Persist
|
||||||
import Lens.Micro ((&), (+~), (.~), (?~), (^.), set)
|
import Lens.Micro ((&), (+~), (.~), (?~), (^.), set)
|
||||||
import Lens.Micro.TH
|
import Lens.Micro.TH
|
||||||
|
@ -64,7 +65,7 @@ buildUI ::
|
||||||
WidgetEnv AppModel AppEvent -> AppModel -> WidgetNode AppModel AppEvent
|
WidgetEnv AppModel AppEvent -> AppModel -> WidgetNode AppModel AppEvent
|
||||||
buildUI wenv model = widgetTree
|
buildUI wenv model = widgetTree
|
||||||
where
|
where
|
||||||
btnColor = rgbHex "#1818B2"
|
btnColor = rgbHex "#ff5722" --rgbHex "#1818B2"
|
||||||
btnHiLite = rgbHex "#207DE8"
|
btnHiLite = rgbHex "#207DE8"
|
||||||
currentWallet =
|
currentWallet =
|
||||||
if null (model ^. wallets)
|
if null (model ^. wallets)
|
||||||
|
@ -95,8 +96,9 @@ buildUI wenv model = widgetTree
|
||||||
[cursorHand, height 25, padding 3] `styleHover`
|
[cursorHand, height 25, padding 3] `styleHover`
|
||||||
[bgColor btnHiLite]
|
[bgColor btnHiLite]
|
||||||
, filler
|
, filler
|
||||||
, remixIcon remixErrorWarningFill
|
, remixIcon remixErrorWarningFill `styleBasic` [textColor white]
|
||||||
, label "Testnet" `nodeVisible` (model ^. network == TestNet)
|
, label "Testnet" `styleBasic` [textColor white] `nodeVisible`
|
||||||
|
(model ^. network == TestNet)
|
||||||
] `styleBasic`
|
] `styleBasic`
|
||||||
[bgColor btnColor]
|
[bgColor btnColor]
|
||||||
walletButton =
|
walletButton =
|
||||||
|
@ -115,47 +117,82 @@ buildUI wenv model = widgetTree
|
||||||
]
|
]
|
||||||
mainPane = box_ [alignMiddle] $ hstack [addressBox, txBox]
|
mainPane = box_ [alignMiddle] $ hstack [addressBox, txBox]
|
||||||
balanceBox =
|
balanceBox =
|
||||||
box_
|
hstack
|
||||||
[alignMiddle]
|
[ filler
|
||||||
(vstack
|
, boxShadow $
|
||||||
[ animFadeIn
|
box_
|
||||||
(label (displayAmount (model ^. network) $ model ^. balance) `styleBasic`
|
[alignMiddle]
|
||||||
[textSize 20])
|
(vstack
|
||||||
, hstack
|
[ animFadeIn
|
||||||
[ filler
|
(label (displayAmount (model ^. network) $ model ^. balance) `styleBasic`
|
||||||
, remixIcon remixHourglassFill `styleBasic` [textSize 8]
|
[textSize 20])
|
||||||
, label
|
, hstack
|
||||||
(maybe "0" (displayAmount (model ^. network)) $
|
[ filler
|
||||||
model ^. unconfBalance) `styleBasic`
|
, remixIcon remixHourglassFill `styleBasic` [textSize 8]
|
||||||
[textSize 8] `nodeVisible`
|
, label
|
||||||
isJust (model ^. unconfBalance)
|
(maybe "0" (displayAmount (model ^. network)) $
|
||||||
, filler
|
model ^. unconfBalance) `styleBasic`
|
||||||
]
|
[textSize 8] `nodeVisible`
|
||||||
])
|
isJust (model ^. unconfBalance)
|
||||||
|
, filler
|
||||||
|
]
|
||||||
|
]) `styleBasic`
|
||||||
|
[bgColor white, radius 5, border 1 btnColor]
|
||||||
|
, filler
|
||||||
|
]
|
||||||
addressBox =
|
addressBox =
|
||||||
|
boxShadow $
|
||||||
box_
|
box_
|
||||||
[alignMiddle]
|
[alignMiddle]
|
||||||
(vstack
|
(vstack
|
||||||
[ label "Addresses:" `styleBasic` [textFont "Regular"]
|
[ label "Addresses" `styleBasic`
|
||||||
|
[textFont "Bold", textColor white, bgColor btnColor]
|
||||||
, vscroll (vstack (zipWith addrRow [0 ..] (model ^. addresses))) `nodeKey`
|
, vscroll (vstack (zipWith addrRow [0 ..] (model ^. addresses))) `nodeKey`
|
||||||
"addrScroll"
|
"addrScroll"
|
||||||
]) `styleBasic`
|
]) `styleBasic`
|
||||||
[border 1 whiteSmoke]
|
[padding 3, radius 2, bgColor white]
|
||||||
addrRow :: Int -> Entity WalletAddress -> WidgetNode AppModel AppEvent
|
addrRow :: Int -> Entity WalletAddress -> WidgetNode AppModel AppEvent
|
||||||
addrRow idx wAddr =
|
addrRow idx wAddr =
|
||||||
box_
|
box_
|
||||||
[onClick $ ShowMsg ("You clicked address " <> showt idx)]
|
[onClick $ ShowMsg ("You clicked address " <> showt idx), alignLeft]
|
||||||
(label
|
(label
|
||||||
(walletAddressName (entityVal wAddr) <>
|
(walletAddressName (entityVal wAddr) <>
|
||||||
": " <> showAddress (walletAddressUAddress $ entityVal wAddr)))
|
": " <> showAddress (walletAddressUAddress $ entityVal wAddr))) `styleBasic`
|
||||||
|
[padding 1, borderB 1 gray]
|
||||||
txBox =
|
txBox =
|
||||||
|
boxShadow $
|
||||||
box_
|
box_
|
||||||
[alignMiddle]
|
[alignMiddle]
|
||||||
(vstack
|
(vstack
|
||||||
[ label "Transactions:" `styleBasic` [textFont "Regular"]
|
[ label "Transactions" `styleBasic`
|
||||||
, label "2024-04-05 0.003 ZEC" `styleBasic` [textFont "Regular"]
|
[textFont "Bold", bgColor btnColor, textColor white]
|
||||||
|
, vscroll (vstack (zipWith txRow [0 ..] (model ^. transactions))) `nodeKey`
|
||||||
|
"txScroll"
|
||||||
]) `styleBasic`
|
]) `styleBasic`
|
||||||
[border 1 whiteSmoke]
|
[radius 2, padding 3, bgColor white]
|
||||||
|
txRow :: Int -> Entity UserTx -> WidgetNode AppModel AppEvent
|
||||||
|
txRow idx tx =
|
||||||
|
box_
|
||||||
|
[onClick $ ShowMsg ("You clicked transaction " <> showt idx)]
|
||||||
|
(hstack
|
||||||
|
[ label
|
||||||
|
(T.pack $
|
||||||
|
show
|
||||||
|
(posixSecondsToUTCTime
|
||||||
|
(fromIntegral (userTxTime $ entityVal tx))))
|
||||||
|
, filler
|
||||||
|
, widgetIf
|
||||||
|
(T.length (userTxMemo $ entityVal tx) > 1)
|
||||||
|
(remixIcon remixDiscussFill)
|
||||||
|
, if 0 >= userTxAmount (entityVal tx)
|
||||||
|
then remixIcon remixArrowRightUpFill `styleBasic` [textColor red]
|
||||||
|
else remixIcon remixArrowRightDownFill `styleBasic`
|
||||||
|
[textColor green]
|
||||||
|
, label $
|
||||||
|
displayAmount (model ^. network) $
|
||||||
|
fromIntegral $ userTxAmount (entityVal tx)
|
||||||
|
]) `styleBasic`
|
||||||
|
[padding 2, borderB 1 gray]
|
||||||
windowFooter =
|
windowFooter =
|
||||||
hstack
|
hstack
|
||||||
[ label
|
[ label
|
||||||
|
|
|
@ -14,13 +14,13 @@ import qualified Monomer.Lens as L
|
||||||
|
|
||||||
zenithTheme :: Theme
|
zenithTheme :: Theme
|
||||||
zenithTheme =
|
zenithTheme =
|
||||||
baseTheme zenithThemeColors & L.basic . L.labelStyle . L.text ?~
|
baseTheme zgoThemeColors & L.basic . L.labelStyle . L.text ?~
|
||||||
TextStyle
|
TextStyle
|
||||||
Nothing
|
Nothing
|
||||||
(Just . FontSize $ 10)
|
(Just . FontSize $ 10)
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
(Just whiteSmoke)
|
(Just black)
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
|
@ -34,7 +34,7 @@ zenithTheme =
|
||||||
(Just . FontSize $ 10)
|
(Just . FontSize $ 10)
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
(Just whiteSmoke)
|
(Just black)
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
Nothing
|
Nothing
|
||||||
|
@ -122,6 +122,85 @@ zenithThemeColors =
|
||||||
, tooltipText = white
|
, tooltipText = white
|
||||||
}
|
}
|
||||||
|
|
||||||
|
zgoThemeColors =
|
||||||
|
BaseThemeColors
|
||||||
|
{ clearColor = gray10 -- gray12,
|
||||||
|
, sectionColor = gray09 -- gray11,
|
||||||
|
, btnFocusBorder = blue08
|
||||||
|
, btnBgBasic = gray07
|
||||||
|
, btnBgHover = gray07c
|
||||||
|
, btnBgFocus = gray07b
|
||||||
|
, btnBgActive = gray06
|
||||||
|
, btnBgDisabled = gray05
|
||||||
|
, btnText = gray02
|
||||||
|
, btnTextDisabled = gray02
|
||||||
|
, btnMainFocusBorder = blue09
|
||||||
|
, btnMainBgBasic = blue05b
|
||||||
|
, btnMainBgHover = blue06
|
||||||
|
, btnMainBgFocus = blue05c
|
||||||
|
, btnMainBgActive = blue05
|
||||||
|
, btnMainBgDisabled = blue04
|
||||||
|
, btnMainText = white
|
||||||
|
, btnMainTextDisabled = white
|
||||||
|
, dialogBg = white
|
||||||
|
, dialogBorder = white
|
||||||
|
, dialogText = black
|
||||||
|
, dialogTitleText = black
|
||||||
|
, emptyOverlay = gray07 & L.a .~ 0.8
|
||||||
|
, shadow = gray00 & L.a .~ 0.2
|
||||||
|
, externalLinkBasic = blue07
|
||||||
|
, externalLinkHover = blue08
|
||||||
|
, externalLinkFocus = blue07
|
||||||
|
, externalLinkActive = blue06
|
||||||
|
, externalLinkDisabled = gray06
|
||||||
|
, iconBg = gray07
|
||||||
|
, iconFg = gray01
|
||||||
|
, inputIconFg = black
|
||||||
|
, inputBorder = gray06
|
||||||
|
, inputFocusBorder = blue07
|
||||||
|
, inputBgBasic = gray10
|
||||||
|
, inputBgHover = white
|
||||||
|
, inputBgFocus = white
|
||||||
|
, inputBgActive = gray09
|
||||||
|
, inputBgDisabled = gray05
|
||||||
|
, inputFgBasic = gray05
|
||||||
|
, inputFgHover = blue07
|
||||||
|
, inputFgFocus = blue07
|
||||||
|
, inputFgActive = blue06
|
||||||
|
, inputFgDisabled = gray04
|
||||||
|
, inputSndBasic = gray04
|
||||||
|
, inputSndHover = gray05
|
||||||
|
, inputSndFocus = gray05
|
||||||
|
, inputSndActive = gray04
|
||||||
|
, inputSndDisabled = gray03
|
||||||
|
, inputHlBasic = gray06
|
||||||
|
, inputHlHover = blue07
|
||||||
|
, inputHlFocus = blue07
|
||||||
|
, inputHlActive = blue06
|
||||||
|
, inputHlDisabled = gray05
|
||||||
|
, inputSelBasic = gray07
|
||||||
|
, inputSelFocus = blue08
|
||||||
|
, inputText = black
|
||||||
|
, inputTextDisabled = gray02
|
||||||
|
, labelText = black
|
||||||
|
, scrollBarBasic = gray03 & L.a .~ 0.2
|
||||||
|
, scrollThumbBasic = gray01 & L.a .~ 0.2
|
||||||
|
, scrollBarHover = gray07 & L.a .~ 0.8
|
||||||
|
, scrollThumbHover = gray05 & L.a .~ 0.8
|
||||||
|
, slMainBg = white
|
||||||
|
, slNormalBgBasic = transparent
|
||||||
|
, slNormalBgHover = gray09
|
||||||
|
, slNormalText = black
|
||||||
|
, slNormalFocusBorder = blue07
|
||||||
|
, slSelectedBgBasic = gray08
|
||||||
|
, slSelectedBgHover = gray09
|
||||||
|
, slSelectedText = black
|
||||||
|
, slSelectedFocusBorder = blue07
|
||||||
|
, tooltipBorder = gray08
|
||||||
|
, tooltipBg = gray07
|
||||||
|
, tooltipText = black
|
||||||
|
}
|
||||||
|
|
||||||
--black = rgbHex "#000000"
|
--black = rgbHex "#000000"
|
||||||
{-white = rgbHex "#FFFFFF"-}
|
{-white = rgbHex "#FFFFFF"-}
|
||||||
blue01 = rgbHex "#002159"
|
blue01 = rgbHex "#002159"
|
||||||
|
|
Loading…
Reference in a new issue