Add interactive guide

thekaplanlab · Jun 30, 2021 · 0e5d292 · 0e5d292
1 parent e517b95
commit 0e5d292
Show file tree

Hide file tree

Showing 8 changed files with 218 additions and 47 deletions.
diff --git a/about.Rmd b/about.Rmd
@@ -58,3 +58,9 @@ We use cookies to recognize your device or browser to adjust the content accordi
 ## Contact
 
 Please contact  [oktay.kaplan\@agu.edu.tr](mailto:[email protected]) or [mustafapir29\@gmail.com](mailto:[email protected]) for any question or inquiries.
+
+<br/><br/>
+
+## Source Code
+
+For source code of the website: [thekaplanlab/CilioGenics-website (github.com)](https://github.com/thekaplanlab/CilioGenics-website)
diff --git a/functions.R b/functions.R
@@ -71,9 +71,9 @@ guide <- Cicerone$
     "Alternatively, you can explore the gene list and clusters."
   )$
   step(
-    "tabs1",
-    "Gene list",
-    "You can toggle between gene search and gene list from side menu."
+    el = "tabs1",
+    title ="Gene list",
+    description ="You can toggle between gene search and gene list from side menu."
   )
 #       "You can click a gene to further explore in detail. The numbers on second table represent order of gene in that column."
 
@@ -82,14 +82,89 @@ guide2 <- Cicerone$
   step(
     "nvbr",
     "Navigation bar",
-    "Here, you can toggle between different tabs"
+    "Here, you can toggle between different tabs. Each tab consists of various information and plots about the gene"
   )$
   step(
-    "general_info",
+    "general_info_box",
     "Gene info",
-    "Here are all the info about the gene "
+    "Here you can find various information about the gene"
+  )$
+  step(
+    "score_box",
+    "CilioGenics scores for each category",
+    "The plot shows CilioGenics score for different categories that can be further explored in other tabs."
+  )
+
+guide3 <- Cicerone$
+  new()$
+  step(
+    "proradio",
+    "Select source",
+    "Here you can select and deselect the source to filter results. By default, all sources are selected."
+  )$
+  step(
+    "protein_box1",
+    "Protein interaction network",
+    "This plot shows the proteins that gene of interest is interacting with. You can see the name of protein by hovering mouse over that dot."
+  )$
+  step(
+    "protein_box2",
+    "Protein interaction table",
+    "The table shows the same interactions, with more information. You can search gene or other information on the table. You can also
+    download the table by clicking download button."
+  )
+
+guide4<- Cicerone$
+  new()$
+  step(
+    "heatmapcluster",
+    "Heatmap",
+    "The genes in this heatmap are the genes that are in the same cluster with searched gene"
+  )$
+  step(
+    "button1",
+    "Toggle button",
+    "Although heatmap of a particular cluster gives a general idea about all genes in that cluster, you can still see orthology information
+    of only the searched gene. For this, click this button to switch between that gene and whole cluster."
+  )$
+  step(
+    "button2",
+    "Download heatmap",
+    "You can download heatmap by clicking this button. Please note that download may take time."
+  )$
+  step(
+    "cluster_box",
+    "Gene list",
+    "Here is the list of all genes which appear in this cluster."
+  )
+
+guide5<- Cicerone$
+  new()$
+  step(
+    "scsource2",
+    "Single cell source",
+    "You can select a single cell source to visualize more information about expression profile of gene of interest. For more information
+     about sources used here, please refer to 'Source' page."
+  )
+
+guide6<- Cicerone$
+  new()$
+  step(
+    "publication_box",
+    "Publications",
+    "Here shows the publications that the gene of interest is mentioned."
   )
 
+guide7<- Cicerone$
+  new()$
+  step(
+    "motif_box",
+    "Motifs",
+    "The motif information is from MotifMap. We have mapped motifs to genome to find the genes that have those motifs in their promoter."
+  )
+
+
+
 
 
 genebar<-function (id1, value1, title1, lowlimit, highlimit){

diff --git a/intro.html b/intro.html
@@ -1,14 +1,25 @@
 <p><img style="display: block; margin-left: auto; margin-right: auto;" src="Logo_browser_ciliogenics.png" width="50" height="60" /></p>
 <h1 style="text-align: center;">Welcome to <strong>CilioGenics</strong></h1>
-<p style="text-align: left;"> <strong>CilioGenics</strong> is a ciliary gene database providing a list of genes which we've predict to function in ciliogenesis or in related pathways.  For the source code of the website: <a href="https://github.com/mustafapir/CilioGenics-website" target="_blank">https://github.com/mustafapir/CilioGenics-website</a> </p>
+<p style="text-align: left;"> <strong>CilioGenics</strong> is an integrated and open source, community friendly database for ciliary genes. </p>
 <hr />
-<p style="text-align: left;">&nbsp;<strong>By using this tool:</strong></p>
+<p style="text-align: left;">&nbsp;<strong>CilioGenics provides a number of resources to:</strong></p>
 <ul>
-<li style="text-align: left;">Any gene can be searched in the database to see if it is predicted to be ciliary,</li>
-<li style="text-align: left;">Explore CilioGenics' predicted ciliary gene list&nbsp;</li>
+<li style="text-align: left;">explore the evolutionary dynamics (the comparative genomics) of each gene (20,000 protein coding genes) in the interactive heatmap.</li>
+<li style="text-align: left;">explore the expression profiles of each gene in ciliated and non-ciliated cells (20,000 protein coding genes) in whole C. elegans organisms and human lung tissue (four scRNA-seq data paper).</li>
+<li style="text-align: left;">view proteomics relationship between ciliary proteins and other proteins</li>
+<li style="text-align: left;">search for the name of gene in each cilia related publications (over 50 cilia related publications presenting a list of ciliary genes)</li>
+<li style="text-align: left;">look for cilia localization data from Protein Atlas (https://www.proteinatlas.org/)</li>
+<li style="text-align: left;">search for cilia-specific motifs.</li>
+
 </ul>
 <hr />
 <p>
+You can click on "help" button on any tab of "Gene search" page to start interactive guide.
+</p>
+<p>
 To report any bugs or for suggestions, please email 
 <a href="mailto:[email protected]?Subject=CilioGenics" target="_top">here</a>.
 </p>
+<p>
+For the source code of the website: <a href="https://github.com/thekaplanlab/CilioGenics-website" target="_blank">https://github.com/thekaplanlab/CilioGenics-website</a> 
+</p>
diff --git a/server.R b/server.R
@@ -31,6 +31,18 @@ server <- function(input, output, session){
   #   dbDisconnect(db)
   #   scores
   # })
+  # observeEvent(input$helpbutton, {
+  #   showModal(
+  #     modalDialog(
+  #       includeHTML("intro.html"),
+  #       easyClose = TRUE,
+  #       footer = tagList(
+  #         actionButton(inputId = "tour2", label = "Introductory Tour", icon = icon("info-circle")),
+  #         actionButton(inputId = "close", label = "Close", icon = icon("close"))
+  #       )
+  #     )
+  #   )
+  # })
 
 
   customnumber<-reactiveVal(0)
@@ -65,6 +77,40 @@ server <- function(input, output, session){
     customnumber(nn)
   })
 
+  observeEvent(input$helpbutton, {
+    #removeModal()
+    if (input$nvbr == "Home"){
+      showModal(
+        modalDialog(
+          includeHTML("intro.html"),
+          easyClose = TRUE,
+          footer = tagList(
+            actionButton(inputId = "tour", label = "Introductory Tour", icon = icon("info-circle")),
+            actionButton(inputId = "close", label = "Close", icon = icon("close"))
+          )
+        )
+      )
+    }
+    else if(input$nvbr == "General info"){
+      guide2$init()$start()
+    }
+    else if(input$nvbr == "Interactions"){
+      guide3$init()$start()
+    }
+    else if(input$nvbr == "Phylogenetic analysis"){
+      guide4$init()$start()
+    }
+    else if(input$nvbr == "Single cell"){
+      guide5$init()$start()
+    }
+    else if(input$nvbr == "Publications"){
+      guide6$init()$start()
+    }
+    else if(input$nvbr == "Motifs"){
+      guide7$init()$start()
+    }
+  })
+
   # Remove modal
   observeEvent(input$close,{
     removeModal()
@@ -1537,6 +1583,7 @@ server <- function(input, output, session){
               id = "button1",
               style = "position: absolute; left: 2em; bottom: 0.5em;",
               dropdown(
+                #inputId = "drpbttn",
                 radioGroupButtons(
                   inputId = "hmapradio",
                   label = "Genes to display:",
@@ -1652,6 +1699,7 @@ server <- function(input, output, session){
         #offset = 1,
         #align = "center",
         box(
+          id = "cluster_box",
           title = paste("Genes in cluster", inputclusternamenumber()),
           solidHeader = TRUE,
           status = "success",

diff --git a/ui.R b/ui.R
@@ -127,14 +127,23 @@ ui <- shinydashboardPlus::dashboardPage(
         menuItem("Gene search", tabName = "hometab", icon = icon("home")),
         menuItem("Explore data", tabName = "exploretab", icon = icon("search")),
         menuItem("How to use CilioGenics", tabName = "howtab", icon = icon("question-circle")),
-        menuItem("Stats", tabName = "statstab", icon = icon("superscript")),
+        #menuItem("Stats", tabName = "statstab", icon = icon("superscript")),
         menuItem("Data", tabName = "datatab", icon = icon("database"),
                  menuSubItem("Source","sourcetab",icon = icon("file")),
                  menuSubItem("Download", "downloadtab", icon = icon("download"))
         ),
-        menuItem("About", tabName = "abouttab", icon = icon("address-card"),
-                 menuSubItem("About us","abouttab2",icon = icon("id-card")),
-                 menuSubItem("Cite", tabName = "citetab", icon = icon("file-alt")))
+        menuItem("About", tabName = "abouttab", icon = icon("address-card")),
+        actionBttn(
+          inputId = "helpbutton",
+          label = "Help",
+          icon = icon("question-circle"),
+          style = "bordered",
+          color = "primary",
+          size = "sm"
+        )
+        #menuItem("Help", tabName = "helptab", icon = icon("question-circle"))
+                 # menuSubItem("About us","abouttab2",icon = icon("id-card")),
+                 # menuSubItem("Cite", tabName = "citetab", icon = icon("file-alt")))
       )
     )
     # div(
@@ -294,14 +303,18 @@ ui <- shinydashboardPlus::dashboardPage(
             id = "general_info",
             br(),
             box(
+              id = "general_info_box",
               title = "Gene info",
               solidHeader = TRUE,
               status = "success",
               width = 6,
               htmlOutput("textgeneid") %>% withSpinner(type = 8)
-            ),
-
+            )
+          ),
+          div(
+            id = "scoreinfo",
             box(
+              id = "score_box",
               title = "CilioGenics scores for each category",
               solidHeader = TRUE,
               status = "success",
@@ -376,17 +389,22 @@ ui <- shinydashboardPlus::dashboardPage(
             column(
               width = 6,
               box(
+                id = "protein_box1",
                 title = "Network plot for protein interactions",
                 width = 12,
                 solidHeader = TRUE,
                 status = "success",
                 uiOutput("pro_box1") %>% withSpinner(type = 8)
               )
               #uiOutput("pro_box1")
-            ),
+            )
+          ),
+          div(
+            id = "protein_interaction1_tbl",
             column(
               width = 6,
               box(
+                id = "protein_box2",
                 width = 12,
                 title = "Protein interactions",
                 solidHeader = TRUE,
@@ -502,6 +520,7 @@ ui <- shinydashboardPlus::dashboardPage(
               offset = 1,
               align = "center",
               box(
+                id = "publication_box",
                 width = 12,
                 title = "List of publications",
                 solidHeader = TRUE,
@@ -528,6 +547,7 @@ ui <- shinydashboardPlus::dashboardPage(
                 width = 10,
                 offset = 1,
                 box(
+                  id = "motif_box",
                   width = 12,
                   solidHeader = TRUE,
                   status = "success",
@@ -850,7 +870,7 @@ ui <- shinydashboardPlus::dashboardPage(
         "citetab"
         ),
       tabItem(
-        "abouttab2",
+        "abouttab",
         tags$iframe(src = 'about.html', # put testdoc.html to /www
                     width = '100%', height = '1200px',
                     frameborder = 0, scrolling = 'auto')

diff --git a/www/about.html b/www/about.html
@@ -210,6 +210,11 @@ <h2>Cookie Policy</h2>
 <div id="contact" class="section level2">
 <h2>Contact</h2>
 <p>Please contact  <a href="mailto:[email protected]">[email protected]</a> or <a href="mailto:[email protected]">[email protected]</a> for any question or inquiries.</p>
+<p><br /><br /></p>
+</div>
+<div id="source-code" class="section level2">
+<h2>Source Code</h2>
+<p>For source code of the website: <a href="https://github.com/thekaplanlab/CilioGenics-website">thekaplanlab/CilioGenics-website (github.com)</a></p>
 </div>