Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
sbalci committed Jun 29, 2024
1 parent 64739c3 commit 42cd71b
Show file tree
Hide file tree
Showing 2 changed files with 245 additions and 1 deletion.
47 changes: 46 additions & 1 deletion app.R
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ library(shiny)
library(whisker)

source("./generate_qmd.R")
source("./generate_html.R")

# UI definition
ui <- fluidPage(
Expand Down Expand Up @@ -45,7 +46,9 @@ ui <- fluidPage(
br(),
downloadButton('downloadFile_qmd', 'Download qmd file'),
br(),
downloadButton('downloadFile_readme', 'Download readme file')
downloadButton('downloadFile_readme', 'Download readme file'),
br(),
downloadButton('downloadFile_html', 'Download html file')
),
mainPanel(
h4("QMD Text:"),
Expand All @@ -54,6 +57,9 @@ ui <- fluidPage(
h4("README Text:"),
actionButton("select_readme", "Select README Text"),
div(id = "readmetext-container", verbatimTextOutput("readmetext")),
h4("html Text:"),
actionButton("select_html", "Select html Text"),
div(id = "htmltext-container", verbatimTextOutput("htmltext")),
textOutput("fileWriteStatus")
)
)
Expand Down Expand Up @@ -107,6 +113,30 @@ server <- function(input, output) {
})


html_data <- eventReactive(input$generate, {
stain <- strsplit(input$stain, ",")[[1]]
stain <- trimws(stain)

html_text(
# base_template = input$base_template,
TemplateTR = input$TemplateTR,
TemplateEN = input$TemplateEN,
# template = input$template,
stain = stain,
# diagnosis = input$diagnosis,
# use_youtube = input$use_youtube,
# youtube_link = input$youtube_link,
# end_template = input$end_template
)
})

output$htmltext <- renderText({
req(html_data())
html_data()
})



output$downloadFile_qmd <- downloadHandler(
filename = function() {
paste0("_", input$template, ".qmd")
Expand All @@ -131,14 +161,29 @@ server <- function(input, output) {
contentType = "text/markdown"
)

output$downloadFile_html <- downloadHandler(
filename = function() {
paste0("htmltext.html")
},
content = function(file) {
writeLines(html_data(), file)
},
contentType = "text/markdown"
)



# JavaScript actions for the selection buttons
observeEvent(input$select_qmd, {
shinyjs::runjs('selectText("qmdtext-container")')
})

observeEvent(input$select_readme, {
shinyjs::runjs('selectText("readmetext-container")')
})
observeEvent(input$select_html, {
shinyjs::runjs('selectText("htmltext-container")')
})



Expand Down
199 changes: 199 additions & 0 deletions generate_html.R
Original file line number Diff line number Diff line change
@@ -0,0 +1,199 @@
# QMD TEXT ----

html_text <- function(
base_template = FALSE,
TemplateTR = "TemplateTR",
TemplateEN = "TemplateEN",
template = "template",
stain = c("HE1", "HE2"),
diagnosis = FALSE,
use_youtube = FALSE,
youtube_link = "youtube_link"
) {

# base_string ----


html_string <- '
<html> <!-- do not use <!DOCTYPE html> -->
<head>
<title>{{TemplateEN}} {{TemplateTR}}</title>
<meta name="keywords" content="{{TemplateEN}}, {{TemplateTR}}, patoloji, atlas, pathology, whole slide image">
<meta name="description" content="{{TemplateEN}} {{TemplateTR}}">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="apple-touch-icon" sizes="180x180" href="https://images.patolojiatlasi.com/img/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="https://images.patolojiatlasi.com/img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="https://images.patolojiatlasi.com/img/favicon-16x16.png">
<link rel="manifest" href="https://images.patolojiatlasi.com/img/site.webmanifest">
<link rel="icon" href="https://images.patolojiatlasi.com/img/favicon.ico" type="image/x-icon" />
<script src="https://images.patolojiatlasi.com/openseadragon/openseadragon.min.js"></script>
<script src="./openseadragon/openseadragon.min.js"></script>
<!-- <script src="openseadragon/openseadragon-scalebar.js"></script> -->
</head>
<body>
<div>
<label for="rotation-slider">Rotate Image:</label>
<input type="range" id="rotation-slider" min="0" max="360" value="0">
</div>
<div id="openseadragon1" style="width: 100%; height: 95%;"></div>
<script type="text/javascript">
var viewer = OpenSeadragon({
id: "openseadragon1",
// prefixUrl: "https://images.patolojiatlasi.com/openseadragon/images/",
prefixUrl: "./openseadragon/images/",
showHomeControl: true,
showRotationControl: true,
showNavigator: true,
showFlipControl: true,
navigatorBackground: "rgb(240, 240, 240)",
tileSources: {
Image: {
Url: "./{{stain}}_files/", // name of image folder
TileSize: "254", // see .dzi file
Overlap: "1", // see .dzi file
Format: "jpeg", // see .dzi file
ServerFormat: "Default", // optional
xmlns: "http://schemas.microsoft.com/deepzoom/2008", // see .dzi file
Size: {
Width: "51792", // see .dzi file
Height: "30580" // see .dzi file
}
}
}
// ,
// tileSources: "yourwsi.dzi",
// sequenceMode: false,
// autoHideControls: true,
// animationTime: 1.0,
// blendTime: 0.6,
// constrainDuringPan: true,
// maxZoomPixelRatio: 1,
// visibilityRatio: 1,
// zoomPerScrolli: 1,
// defaultZoomLevel: 1,
// showReferenceStrip: true,
// showNavigator: true,
// showFullPageControl: false
});
/* viewer.scalebar({
minWidth: "100px",
pixelsPerMeter: "1.98255e+06",
fontFamily: "Arial",
backgroundColor: "rgba(255, 255, 255, 0.5)",
fontSize: "small",
barThickness: "2",
xOffset: "10",
yOffset: "10"
}); */
// Add a keydown event listener to the document
document.addEventListener("keydown", function (event) {
switch (event.keyCode) {
case 90: // "Z" key for zoom in
viewer.viewport.zoomBy(1.2);
viewer.viewport.applyConstraints();
break;
case 88: // "X" key for zoom out
viewer.viewport.zoomBy(0.8);
viewer.viewport.applyConstraints();
break;
case 37: // Left arrow key
case 65: // "A" key
viewer.viewport.panBy(new OpenSeadragon.Point(-0.05, 0));
viewer.viewport.applyConstraints();
break;
case 38: // Up arrow key
case 87: // "W" key
viewer.viewport.panBy(new OpenSeadragon.Point(0, -0.05));
viewer.viewport.applyConstraints();
break;
case 39: // Right arrow key
case 68: // "D" key
viewer.viewport.panBy(new OpenSeadragon.Point(0.05, 0));
viewer.viewport.applyConstraints();
break;
case 40: // Down arrow key
case 83: // "S" key
viewer.viewport.panBy(new OpenSeadragon.Point(0, 0.05));
viewer.viewport.applyConstraints();
break;
}
});
document.getElementById("rotation-slider").addEventListener("input", function (event) {
var rotationAngle = event.target.value;
viewer.viewport.setRotation(parseFloat(rotationAngle));
});
</script>
</body>
</html>
'



# html_text ----

html_text <- ''


# text render ----

for (s in stain) {
data_1 <- list(
TemplateTR = TemplateTR,
TemplateEN = TemplateEN,
stain = s
)

text_1 <- whisker::whisker.render(html_string, data_1)


html_text <- paste(html_text, text_1, sep = "\n\n")

}




return(html_text)

}


0 comments on commit 42cd71b

Please sign in to comment.