solarscored is ready

This commit is contained in:
Angela Minster 2023-02-15 09:47:39 -05:00
parent 4866a97022
commit ffab159cef
5 changed files with 360 additions and 86 deletions

View File

@ -19,13 +19,13 @@ svgdata <- readLines("wheel.svg")
user <- Sys.info()[['user']]
isRstudio <- user == 'rstudio-connect'
baseDir <- ifelse(isRstudio, '/rstudio-data/solarscored_data.RData', './')
file.location <- paste0(baseDir, 'solarscored_data.RData')
file.location <- ifelse(
isRstudio
, '/rstudio-data/solarscored_data.RData'
, '~/user_metrics/apps/solana/solarscored/solarscored_data.RData'
)
load(file.location)
# print(exists("score.criteria"))
score_criteria <- read.csv(
paste0(baseDir, 'score_criteria.csv')
) %>% as.data.table()
bar.plot.colors <- c("#14F195", "#B2FBDC")

View File

@ -4,10 +4,10 @@ function(input, output, session) {
#observeEvent("sol_address")
# output$useraddy <- renderUI({
# textInput("addy", "SOURCE ADDRESS:", value = connected.addy$addy)
# })
output$useraddy <- renderUI({
textInput("addy", label = "SOURCE ADDRESS", value = connected.addy$addy, width = "400px")
})
userRecord <- reactive({
if(!is.null(input$addy)) {
@ -30,13 +30,10 @@ function(input, output, session) {
connected.addy$addy <- input$sol_address
# updateActionButton(session = session, inputId = "connect",
# label = paste0("connected as ", substr(input$sol_address, 1, 7), "..."),
# icon = character(0))
# tmp <- data.table(address = input$sol_address,
# time = Sys.time(),
# score = userScore())
# write.csv(tmp, file = paste0("/rstudio-data/optimistic-data/", input$eth_address, "_", Sys.time(), ".csv"), row.names = FALSE)
tmp <- data.table(address = input$sol_address,
time = Sys.time(),
score = userRecord()$total_score)
write.csv(tmp, file = paste0("/rstudio-data/solarscored-data/", input$sol_address, "_", Sys.time(), ".csv"), row.names = FALSE)
} else {

View File

@ -9,6 +9,7 @@
fluidPage(
tags$head(
tags$link(rel = "stylesheet", type = "text/css", href = "shiny.css"),
tags$link(rel = "stylesheet", type = "text/css", href = "wallet.css"),
tags$link(rel = "stylesheet", href = "https://fonts.googleapis.com/css?family=Orbitron"),
tags$link(rel = "stylesheet", href = "https://fonts.googleapis.com/css?family=Exo+2"),
#tags$link(rel = "stylesheet", href = "https://fonts.googleapis.com/css?family=Roboto+Mono"),
@ -20,32 +21,36 @@ fluidPage(
chooseSliderSkin("Round"),
fluidRow(class = "titlerow",
column(9, class = "title", img(src = "solarscored-logo.svg", width = '480px')),
column(3,
column(8, class = "title", img(src = "solarscored-logo.svg", width = '480px')),
column(4,
div(id = "icons",
div(class = "aboutlinks",
a(id = 'fork',
href = "https://github.com/FlipsideCrypto/user_metrics/tree/main/apps/solana/solarscored",
img(src = "github.svg", width = "30px"),
img(src = "github.svg", width = "35px"),
onclick = "rudderstack.track('solarscored-click-github')",
target = "_blank")),
bsTooltip(id = "fork",
title = "Fork this App",
placement = "bottom", trigger = "hover"),
div(class = "aboutlinks",
a(id = "flippy",
href = "https://next.flipsidecrypto.xyz/",
img(src = "flipside.svg", width = "30px"),
href = "https://flipsidecrypto.xyz/",
img(src = "flipside.svg", width = "35px"),
onclick = "rudderstack.track('solarscored-click-flipside')",
target = "_blank")),
bsTooltip(id = "flippy",
title = "Get the Data",
placement = "bottom", trigger = "hover"),
div(class = "aboutlinks",
a(id = "solana", href = "https://solana.com",
img(src = "solana.svg", width = "30px"),
img(src = "solana.svg", width = "35px"),
onclick = "rudderstack.track('solarscored-click-solana')",
target = "_blank")),
bsTooltip(id = "solana",
title = "Solana",
placement = "bottom", trigger = "hover")
placement = "bottom", trigger = "hover"),
SolWalletHandler("sol_address")
))),
@ -53,13 +58,12 @@ fluidPage(
fluidRow(class = "dashmid",
column(7,
div(class = "addybuttons",
#uiOutput("useraddy"),
div(id = "sourceaddress", "SOURCE ADDRESS:"),
SolWalletHandler("sol_address")
),
#actionButton(inputId = "randomaddy", label = img(src = "random.svg", height = "26")),
div(class = "addybuttons",
uiOutput("useraddy"),
actionButton(inputId = "randomaddy", label = img(src = "random.svg", height = "26"))),
bsTooltip(id = "randomaddy",
title = "show a random address",
placement = "bottom", trigger = "hover"),
div(id = "wheelpart",
uiOutput("svgout") %>%
@ -71,6 +75,7 @@ fluidPage(
options = list(bgcolor = "#FFF"),
#scale = 2,
img(src = "camera.svg", height = "20"),
onclick = "rudderstack.track('solarscored-camera')",
title = "Download the Circle")),
bsTooltip(id = "pic",
title = "Download the Wheel",
@ -150,7 +155,8 @@ fluidPage(
div(id = "sliderbox",
plotlyOutput("scorehist", height = "100px"),
uiOutput("outputslider"),
uiOutput("bdnldscores")))
a(uiOutput("bdnldscores"), onclick = "rudderstack.track('solarscored-click-solana')")
))
) #close left column box

View File

@ -24,6 +24,11 @@ a[title]:hover::after {
color: orange;
}
#sol_address {
margin-left: 20px;
}
.container-fluid {
width: 80%;
max-width: 1200px;
@ -47,76 +52,31 @@ a[title]:hover::after {
margin-top: 10px;
}
/* centering the address input + buttons
/* centering the address input + buttons */
.addybuttons {
display: flex;
margin: auto;
align-items: baseline;
vertical-align: bottom;
justify-content: center;
}
*/
.addybuttons {
justify-content: left;
font-family: 'Exo 2';
font-weight: 500;
border: solid #E2E4F7 2px;
border-radius: 8px;
background-color: white;
color: #56575E;
margin-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
}
#sourceaddress {
font-family: 'Orbitron';
font-size: 13.6px;
font-weight: 700;
padding-left: 5px;
}
#useraddy label {
font-family: 'Orbitron';
font-size: 13.6px;
}
#useraddy {
min-width: 400px;
}
#addy {
border: solid #E2E4F7 2px;
border-radius: 8px;
min-width: 400px;
}
#sol_address {
font-family: 'Orbitron';
font-size: 13.6px;
color: black;
text-transform: capitalize;
min-width: 400px;
}
#sol_address:hover {
background-color: #E2E4F7;
}
.wallet-adapter-button-trigger {
font-family: 'Exo 2';
font-weight: 500;
border: solid #E2E4F7 2px;
border-radius: 8px;
background-color: white;
color: #56575E;
text-transform: capitalize;
max-height: 42px;
line-height: 14px;
min-width: 400px;
}
.wallet-adapter-button-trigger:hover {
background-color: #E2E4F7;
}
.btn-default, .btn-default:focus {
border: solid #E2E4F7 2px;
@ -164,7 +124,7 @@ a[title]:hover::after {
background-color: #ffffff99;
padding-top: 15px;
padding-bottom: 10px;
margin-top: 10px;
margin-top: 28px;
}
#botrightbox {
border: 2px #E2E4F7 solid;
@ -326,12 +286,12 @@ These are the ticks and text of the sliders
.boxtitle {
text-align: center;
font-size: 1em;
font-family: Orbitron;
margin-bottom: 10px;
}
.aboutlinks {
margin-top: 6px;
padding-left: 20px;
padding-bottom: 15px;
}
@ -370,3 +330,13 @@ These are the ticks and text of the sliders
.load-container {
margin-top: 200px;
}

View File

@ -0,0 +1,301 @@
.wallet-adapter-button {
background-color: transparent;
border: none;
color: black;
cursor: pointer;
display: flex;
align-items: center;
font-family: 'Exo 2';
font-size: 14px;
font-weight: 500;
height: 36px;
line-height: 14px;
border-radius: 8px;
padding: 22px;
}
.wallet-adapter-button:hover {
}
.wallet-adapter-button-trigger {
background-color: #E2E4F7;
}
.wallet-adapter-button:not([disabled]):focus-visible {
outline-color: white;
}
.wallet-adapter-button:not([disabled]):hover {
background-color: #E2E4F7;
}
.wallet-adapter-button[disabled] {
background: #E2E4F7;
color: black;
cursor: not-allowed;
}
.wallet-adapter-button-end-icon,
.wallet-adapter-button-start-icon,
.wallet-adapter-button-end-icon img,
.wallet-adapter-button-start-icon img {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
}
.wallet-adapter-button-end-icon {
margin-left: 12px;
}
.wallet-adapter-button-start-icon {
margin-right: 12px;
}
.wallet-adapter-collapse {
width: 100%;
}
.wallet-adapter-dropdown {
position: relative;
display: inline-block;
}
.wallet-adapter-dropdown-list {
position: absolute;
z-index: 99;
display: grid;
grid-template-rows: 1fr;
grid-row-gap: 10px;
padding: 10px;
top: 100%;
right: 0;
margin: 0;
list-style: none;
background: #E2E4F7;
border-radius: 10px;
box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.6);
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease, transform 200ms ease, visibility 200ms;
font-family: 'DM Sans', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.wallet-adapter-dropdown-list-active {
opacity: 1;
visibility: visible;
transform: translateY(10px);
}
.wallet-adapter-dropdown-list-item {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border: none;
outline: none;
cursor: pointer;
white-space: nowrap;
box-sizing: border-box;
padding: 0 20px;
width: 100%;
border-radius: 6px;
font-size: 14px;
font-weight: 600;
height: 37px;
color: black;
}
.wallet-adapter-dropdown-list-item:not([disabled]):hover {
background-color: #E2E4F7;
}
.wallet-adapter-modal-collapse-button svg {
align-self: center;
fill: #E2E4F7;
}
.wallet-adapter-modal-collapse-button.wallet-adapter-modal-collapse-button-active svg {
transform: rotate(180deg);
transition: transform ease-in 150ms;
}
.wallet-adapter-modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0;
transition: opacity linear 150ms;
background: rgba(0, 0, 0, 0.5);
z-index: 1040;
overflow-y: auto;
}
.wallet-adapter-modal.wallet-adapter-modal-fade-in {
opacity: 1;
}
.wallet-adapter-modal-button-close {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 18px;
right: 18px;
padding: 12px;
cursor: pointer;
background: black;
border: none;
border-radius: 50%;
}
.wallet-adapter-modal-button-close:focus-visible {
outline-color: white;
}
.wallet-adapter-modal-button-close svg {
fill: #E2E4F7;
transition: fill 200ms ease 0s;
}
.wallet-adapter-modal-button-close:hover svg {
fill: #fff;
}
.wallet-adapter-modal-overlay {
background: rgba(0, 0, 0, 0.25);;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.wallet-adapter-modal-container {
display: flex;
margin: 3rem;
min-height: calc(100vh - 6rem); /* 100vh - 2 * margin */
align-items: center;
justify-content: center;
}
@media (max-width: 480px) {
.wallet-adapter-modal-container {
margin: 1rem;
min-height: calc(100vh - 2rem); /* 100vh - 2 * margin */
}
}
.wallet-adapter-modal-wrapper {
box-sizing: border-box;
position: relative;
display: flex;
align-items: center;
flex-direction: column;
z-index: 1050;
max-width: 400px;
border-radius: 10px;
background: #E2E4F7;
box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.6);
font-family: 'DM Sans', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
flex: 1;
}
.wallet-adapter-modal-wrapper .wallet-adapter-button {
width: 100%;
}
.wallet-adapter-modal-title {
font-weight: 500;
font-size: 24px;
line-height: 36px;
margin: 0;
padding: 64px 48px 48px 48px;
text-align: center;
color: black;
}
@media (max-width: 374px) {
.wallet-adapter-modal-title {
font-size: 18px;
}
}
.wallet-adapter-modal-list {
margin: 0 0 12px 0;
padding: 0;
width: 100%;
list-style: none;
}
.wallet-adapter-modal-list .wallet-adapter-button {
font-weight: 400;
border-radius: 0;
font-size: 18px;
}
.wallet-adapter-modal-list .wallet-adapter-button-end-icon,
.wallet-adapter-modal-list .wallet-adapter-button-start-icon,
.wallet-adapter-modal-list .wallet-adapter-button-end-icon img,
.wallet-adapter-modal-list .wallet-adapter-button-start-icon img {
width: 28px;
height: 28px;
}
.wallet-adapter-modal-list .wallet-adapter-button span {
margin-left: auto;
font-size: 14px;
opacity: .6;
}
.wallet-adapter-modal-list-more {
cursor: pointer;
border: none;
padding: 12px 24px 24px 12px;
align-self: flex-end;
display: flex;
align-items: center;
background-color: transparent;
color: black;
}
.wallet-adapter-modal-list-more svg {
transition: all 0.1s ease;
fill: #E2E4F7;
margin-left: 0.5rem;
}
.wallet-adapter-modal-list-more-icon-rotate {
transform: rotate(180deg);
}
.wallet-adapter-modal-middle {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 0 24px 24px 24px;
box-sizing: border-box;
}
.wallet-adapter-modal-middle-button {
display: block;
cursor: pointer;
margin-top: 48px;
width: 100%;
background-color: #E2E4F7;
padding: 12px;
font-size: 18px;
border: none;
border-radius: 8px;
color: black
}