From 1485026777228ab07c335cb27f795812e2868860 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rafa=C5=82=20Piskorski?= Date: Thu, 3 Dec 2020 10:31:23 +0100 Subject: [PATCH] Revert "interface" This reverts commit ffcd819468616004ae45e038ba798d591b0590fe. --- app/app.R | 155 +++++++------------------ app/www/main.css | 24 ---- app/www/style.css | 282 ---------------------------------------------- 3 files changed, 39 insertions(+), 422 deletions(-) delete mode 100644 app/www/main.css delete mode 100644 app/www/style.css diff --git a/app/app.R b/app/app.R index dafd217..1cd079f 100644 --- a/app/app.R +++ b/app/app.R @@ -1,126 +1,49 @@ +# +# This is a Shiny web application. You can run the application by clicking +# the 'Run App' button above. +# +# Find out more about building applications with Shiny here: +# +# http://shiny.rstudio.com/ +# + library(shiny) -library(magrittr) -library(ggplot2) -library(plotly) -library(DT) +# Define UI for application that draws a histogram ui <- fluidPage( - tags$head( - tags$style(HTML(" - @import url('//fonts.googleapis.com/css?family=Lobster|Cabin:400,700'); - @import url('//fonts.googleapis.com/css2?family=Fjalla+One'); - - "))), - - theme = "style.css", - - fluidRow( - column(12, - navbarPage("", - tabPanel("TakeCareApp"), - tabPanel("Firmy"), - tabPanel("O nas"), - tabPanel("Zaloguj")), - - )), - # App title ---- - - fluidRow( - column(3, - tags$div("Panel sterowania") %>% tagAppendAttributes(class="panel-title") - - )%>% tagAppendAttributes(id = 'column-panel'), - column(9, - tabsetPanel(type = "tabs", - tabPanel("Zakładka 1", tags$div(plotlyOutput("plot1",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')), - tabPanel("Zakładka 2", tags$div(plotlyOutput("plot2",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')), - tabPanel("Zakładka 3", tags$div(plotlyOutput("plot3",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')), - tabPanel("Zakładka 4", tags$div(plotlyOutput("plot4",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')), - tabPanel("Zakładka 5", tags$div(DT::dataTableOutput("table1",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')), - tabPanel("Zakładka 6", tags$div(DT::dataTableOutput("table2",height = "auto"))%>% tagAppendAttributes(class = 'content-wrapper')) - ))%>% tagAppendAttributes(id = 'column-content') - ) %>% tagAppendAttributes(id = 'row-content'), - - - - fluidRow( - column(12, - tags$span("© Copyright Wszystkie prawa zastrzeżone."))%>% tagAppendAttributes(id = 'column-copyright'), - - )%>% tagAppendAttributes(id = 'row-footer') - - + # Application title + titlePanel("Old Faithful Geyser Data"), + + # Sidebar with a slider input for number of bins + sidebarLayout( + sidebarPanel( + sliderInput("bins", + "Number of bins:", + min = 1, + max = 50, + value = 30) + ), + + # Show a plot of the generated distribution + mainPanel( + plotOutput("distPlot") + ) + ) ) +# Define server logic required to draw a histogram server <- function(input, output) { - - output$plot1 <- renderPlotly({ - - g<-ggplot(mpg) + - geom_point(mapping = aes(x = displ, y = hwy)) - - gg<-ggplotly(g) - - gg - + + output$distPlot <- renderPlot({ + # generate bins based on input$bins from ui.R + x <- faithful[, 2] + bins <- seq(min(x), max(x), length.out = input$bins + 1) + + # draw the histogram with the specified number of bins + hist(x, breaks = bins, col = 'darkgray', border = 'white') }) - - output$plot2 <- renderPlotly({ - - g<-ggplot(data = mpg, mapping = aes(x = cty, y = hwy)) + - geom_jitter() - - gg<-ggplotly(g) - - gg - - }) - - output$plot3 <- renderPlotly({ - - g<-ggplot(data = mpg, mapping = aes(x = displ, y = hwy, color = drv)) + - geom_point() + - geom_smooth(se = FALSE) - - gg<-ggplotly(g) - - gg - - }) - - output$plot4 <- renderPlotly({ - - g<-ggplot(data = mpg, mapping = aes(x = displ, y = hwy)) + - geom_point(mapping = aes(color=drv)) + - geom_smooth(se = FALSE) - - gg<-ggplotly(g) - - gg - - }) - - pl <- list( - sSearch = "Szukaj", - sInfo="Wyniki od _START_ do _END_ z _TOTAL_ rekordów", - sZeroRecords="Brak rekordów", - sEmptyTable="Pusta tabela", - oPaginate= list( - sFirst="Pierwsza", sPrevious="Poprzednia",sLast="Ostatnia", sNext="Następna" - ), - sLengthMenu = "Pokaż _MENU_ rekordów na stronie" - ) - - output$table1 <- DT::renderDataTable(iris,options = list(scrollX = TRUE,language=pl)) - - - table<-DT::renderDataTable(mpg,options = list(scrollX = TRUE,language=pl)) - output$table2 <- table - - - - } -shinyApp(ui=ui,server=server) \ No newline at end of file +# Run the application +shinyApp(ui = ui, server = server) diff --git a/app/www/main.css b/app/www/main.css deleted file mode 100644 index 4d26c3c..0000000 --- a/app/www/main.css +++ /dev/null @@ -1,24 +0,0 @@ -.main-pattern { - position: relative; - height: 500px; - background-image: linear-gradient(#3cfa97, #cafce2); - border-top-left-radius: 80% 50%; - border-bottom-right-radius: 80% 50%; -} - -h1 { - margin: 0; - color: #ffffff; - font-family: 'Raleway',sans-serif; - font-size: 62px; - font-weight: 800; - line-height: 72px; - margin: 0 0 24px; - text-align: center; - -} - -header h1 { - color: white; -} - diff --git a/app/www/style.css b/app/www/style.css deleted file mode 100644 index 204bf09..0000000 --- a/app/www/style.css +++ /dev/null @@ -1,282 +0,0 @@ -body{ -background-color: #C7F9CC; -height:100vh; - -} -body >.container-fluid{ -height:100vh; -} -.container-fluid{ -display:flex; -flex-direction: column; - - -} -.row{ -display:flex; -flex-direction:row; -flex-wrap:wrap; - -} -.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{ -display:flex; -flex-direction:column; -padding:0; -margin-bottom:10px; -} - -.navbar-brand{ -display:none; - - -} - - - -.navbar{ -padding-left:0; -background-color:#00A896; -} - -.navbar-default{ - background-color:#00A896; -} -# - - - - - -.navbar-nav >li:first-child >a { - background-color: #028090; - box-shadow: 0.5px 0px 0px #FFFFFF; - font-family: Lobster !important; - font-style: normal; - font-weight: normal; - font-size: 20px; - #line-height: 9px; - -/* or 90% */ - #display: flex; - - #align-items: center; - #text-align: center; - - color: #FFFFFF !important; -} - -.navbar-nav >li:first-child.active >a { - #background-color: #028090; - #color: #FFFFFF !important; -} - - -.navbar-nav >li:first-child >a { -#background-color: #028090; -# color: #FFFFFF !important; -} - -.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover { - background-color: #008375; - color: #FFFFFF !important; - font-family: Fjalla One; - -} -.navbar-default .navbar-nav > li > a{ - color: #FFFFFF !important; - font-family: Fjalla One; - text-align: center; -} - -.navbar-nav >li:first-child.active >a, .navbar-nav >li:first-child.active >a:hover, .navbar-nav >li:first-child.active >a:focus,.navbar-nav >li:first-child >a:focus,.navbar-nav >li:first-child >a:hover,.navbar-nav >li:first-child >a { - background-color: #028090; - color: #FFFFFF !important; - background-color: #028090; - box-shadow: 0.5px 0px 0px #FFFFFF; - font-family: Lobster !important; - font-style: normal; - font-weight: normal; - font-size: 20px; -} - -#row-content{ - margin-left:0; - margin-right:0; - margin-bottom:auto; - -} - -#column-panel{ - box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(0, 0, 0, 0.25); - - background-color:white; - -} - -#column-content{ - box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(0, 0, 0, 0.25); - background-color:white; - - -} -.content-wrapper{ -padding-top:10px; - padding-bottom:10px; - padding-left:5px; - padding-right:5px; - -} - -.panel-title{ -display:flex; -height:40px; -background-color:#028090; -color:white; -justify-content:center; -align-items:center; -font-family:Fjalla One; -} - - - - - -.nav-tabs{ -color:white; -background-color:#028090; -border-bottom:#028090; -} -.nav-tabs > li{ -margin-bottom:0; -} - -.nav-tabs > li > a{ -color:white; -background-color:#028090; -border:none; -border-radius:0; -font-family:Fjalla One; -} - -.nav-tabs > li > a:hover { -color:white; -background-color:#028090; -border:none; -} - -.nav-tabs > li > a:focus { -color:white; -background-color:#028090; -border:none; -} - -.nav-tabs > li { - border:none; - border-radius:0; -} -.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{ -color:#028090; -background-color:white; -border:none; -border-radius:0; -} - - -#row-footer{ -height:50px; -border-top:2px solid white; -margin-top:auto; -} - -#column-copyright{ -padding-left:15px; -margin:0; - -} -#column-copyright > span{ - height:100%; - color:#00a896; - -} - -table.dataTable tr:nth-child(even){ - background-color:#C7F9CC!important; -} -table.dataTable tr:nth-child(odd){ - background-color:#A7D7AC !important; - -} - -table.dataTable th{ - background-color:white !important; -} -.datatables .dataTables_wrapper .dataTables_paginate a{ - border:none; - -} - - -.datatables .dataTables_wrapper .dataTables_paginate span > a:hover,.datatables .dataTables_wrapper .dataTables_paginate span > a.current,.datatables .dataTables_wrapper .dataTables_paginate span > a.current:hover,.datatables .dataTables_wrapper .dataTables_paginate > .previous:hover,.datatables .dataTables_wrapper .dataTables_paginate > .next:hover { - color:white !important; - background:#05668dff !important; - border:none; - box-shadow: 0.5px 0px 0px #FFFFFF; - -} - -.datatables .dataTables_wrapper .dataTables_paginate .previous.disabled,.datatables .dataTables_wrapper .dataTables_paginate .next.disabled{ - display:none!important; -} - - - -@media only screen and (max-width: 767px) { - .col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{ - width:100%; - } - - #column-panel{ - - min-height:500px; - -} - -#column-content{ - - min-height:500px; - - - -} } - - -@media only screen and (min-width: 768px) { -.navbar-nav{ - width:100%; - margin-left:-15px; - display:flex !important; -} -.navbar-nav > li:last-of-type { - align-self:flex-end; - margin-left:auto; - #float:right !important; -} - -#row-content{ - justify-content:space-between; -} - -#column-panel{ - width:23%; - height:900px; - -} - -#column-content{ - width:73%; - min-height:900px; - - -} - -}