close #1; start 2019.11.15 presentation

ropensci · Nov 10, 2019 · 40d9b13 · 40d9b13
1 parent 7cde994
commit 40d9b13
Show file tree

Hide file tree

Showing 19 changed files with 236 additions and 295 deletions.
diff --git a/NEWS b/NEWS
@@ -1,4 +1,6 @@
 phonfieldwork 0.0.3 (...2019)
+  - vertically and horisontally center text in presentations created by "create_presentation()"; thx @Pandaklez #1
+  - add the "font_size" argument to the "create_presentation()" function
 
 phonfieldwork 0.0.2 (23.09.2019)
   - make the "create_presentation()" function render silently

diff --git a/R/create_presentation.R b/R/create_presentation.R
@@ -1,11 +1,12 @@
 #' Creates a presentation
 #'
-#' Creates an html or powerpoint presentation in a working directory from list of words and translations.
+#' Creates an html or powerpoint presentation in a working directory from list of words and translations. \href{https://agricolamz.github.io/phonfieldwork/first_example.html}{Here} is an example of such presentation.
 #'
 #' @author George Moroz <agricolamz@gmail.com>
 #'
 #' @param stimuli the vector of stimuli (obligatory)
 #' @param translations the vector of translations (optional)
+#' @param font_size font size in px (50, by default)
 #' @param output_format the string that difine the R Markdown output format: "html" (by default) or "pptx"
 #' @param output_file the name of the result presentation file (by default stimuli_presentation)
 #' @param output_dir the output directory for the rendered file
@@ -22,22 +23,38 @@
 
 create_presentation <- function(stimuli,
                                 translations = "",
+                                font_size = 50,
                                 output_dir,
                                 output_format = "html",
                                 output_file = "stimuli_presentation",
                                 render = TRUE) {
   output_format <- ifelse(output_format == "pptx",
-                   "powerpoint_presentation",
-                   "ioslides_presentation")
-  rmd <- paste0(c(paste0("---\ntitle: 'Use arrows for scrolling'\noutput: ",
+                   "  powerpoint_presentation",
+                   "  ioslides_presentation:\n    transition: faster")
+  rmd <- paste0(c(paste0("---\ntitle: 'Use arrows for scrolling'\noutput:\n",
                          output_format,
                          "\n---\n\n"),
                   collapse = ""),
-                 paste0("## ",
+                 paste0('##\n<div class="container">\n**',
                        stimuli,
-                       "\n\n",
+                       "**\n\n",
                        translations,
-                       "\n\n"),
+                       "</div>",
+                       collapse = ""),
+                paste0("<style>\n",
+                '.container {
+    position: absolute;
+    top: 50%;
+    left: 50%;',
+    'font-size: ',
+    font_size,
+    'px;
+    -moz-transform: translateX(-50%) translateY(-50%);
+    -webkit-transform: translateX(-50%) translateY(-50%);
+    transform: translateX(-50%) translateY(-50%);
+                }
+<\\\\style>
+'),
                collapse = "")
   tmp <- tempfile(pattern = output_file, fileext = ".Rmd")
   writeLines(rmd, tmp)

diff --git a/docs/first_example.html b/docs/first_example.html
@@ -3073,18 +3073,18 @@
     }
 
     slides > slide {
-      -webkit-transition: all 0.4s ease-in-out;
-      -moz-transition: all 0.4s ease-in-out;
-      -o-transition: all 0.4s ease-in-out;
-      transition: all 0.4s ease-in-out;
+      -webkit-transition: all 0.2s ease-in-out;
+      -moz-transition: all 0.2s ease-in-out;
+      -o-transition: all 0.2s ease-in-out;
+      transition: all 0.2s ease-in-out;
     }
 
     .auto-fadein {
       -webkit-transition: opacity 0.6s ease-in;
-      -webkit-transition-delay: 0.4s;
-      -moz-transition: opacity 0.6s ease-in 0.4s;
-      -o-transition: opacity 0.6s ease-in 0.4s;
-      transition: opacity 0.6s ease-in 0.4s;
+      -webkit-transition-delay: 0.2s;
+      -moz-transition: opacity 0.6s ease-in 0.2s;
+      -o-transition: opacity 0.6s ease-in 0.2s;
+      transition: opacity 0.6s ease-in 0.2s;
       opacity: 0;
     }
 /* https://github.com/ropensci/plotly/pull/524#issuecomment-468142578 */
@@ -3110,11 +3110,41 @@ <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>
           </hgroup>
   </slide>
 
-<slide class=""><hgroup><h2>tip</h2></hgroup><article  id="tip">
+<slide class=""><hgroup><h2></h2></hgroup><article  id="section">
 
-</article></slide><slide class=""><hgroup><h2>tap</h2></hgroup><article  id="tap">
+<div class="container">
+<p><strong>tip</strong></p></div>
 
-</article></slide><slide class=""><hgroup><h2>top</h2></hgroup><article  id="top"></article></slide>
+</article></slide><slide class=""><hgroup><h2></h2></hgroup><article  id="section-1">
+
+<div class="container">
+<p><strong>tap</strong></p></div>
+
+</article></slide><slide class=""><hgroup><h2></h2></hgroup><article  id="section-2">
+
+<div class="container">
+<p><strong>top</strong></p></div>
+
+<style>
+
+.container { position: absolute; top: 50%; left: 50%;font-size: 50px; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } &lt;\style&gt; ##
+
+<div class="container">
+<p><strong>tip</strong></p></div>
+
+</article></slide><slide class=""><hgroup><h2></h2></hgroup><article  id="section-3">
+
+<div class="container">
+<p><strong>tap</strong></p></div>
+
+</article></slide><slide class=""><hgroup><h2></h2></hgroup><article  id="section-4">
+
+<div class="container">
+<p><strong>top</strong></p></div>
+
+<style>
+
+<p>.container { position: absolute; top: 50%; left: 50%;font-size: 50px; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } &lt;\style&gt;</p></article></slide>
 
 
   <slide class="backdrop"></slide>

diff --git a/docs/index.html b/docs/index.html
@@ -1790,7 +1790,7 @@ <h2><span class="header-section-number">4.3</span> Rename collected data</h2>
 ##     ├── s2_tip_1.wav
 ##     └── s2_top_3.wav</code></pre>
 <p>The last command renamed the soundfiles in the <code>s2</code> folder, adding the prefix <code>s2</code> as in the previous example, and the suffix <code>1</code>-<code>3</code>. On most operating systems it is impossible to create two files with the same name, so sometimes it can be useful to add some kind of index at the end of the files.</p>
-<p>For now <code>phonfieldwork</code> works only with <code>.wav</code> files, but I will try to implement more possibilities in the future (such as ELAN .eaf and EXMARaLDA.exb).</p>
+<p>For now <code>phonfieldwork</code> works only with <code>.wav</code> files, but I will try to implement more possibilities in the future (such as <code>.mp4</code> for Sign language videos).</p>
 </div>
 <div id="merge-all-data-together" class="section level2">
 <h2><span class="header-section-number">4.4</span> Merge all data together</h2>
@@ -1981,7 +1981,7 @@ <h2><span class="header-section-number">4.8</span> Create a viewer</h2>
 ##   ordinary text without R code
 ## 
 ## 
-## /usr/bin/pandoc +RTS -K512m -RTS skeleton.utf8.md --to html4 --from markdown+autolink_bare_uris+ascii_identifiers+tex_math_single_backslash+smart --output /home/agricolamz/work/packages/phonfieldwork/docs/s1/stimuli_viewer.html --email-obfuscation none --self-contained --standalone --section-divs --template /home/agricolamz/R/x86_64-pc-linux-gnu-library/3.6/rmarkdown/rmd/h/default.html --no-highlight --variable highlightjs=1 --variable &#39;theme:bootstrap&#39; --include-in-header /tmp/RtmpTfAXv8/rmarkdown-str5bf229b96c08.html --mathjax --variable &#39;mathjax-url:https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&#39; --metadata pagetitle=skeleton.utf8.md</code></pre>
+## /usr/bin/pandoc +RTS -K512m -RTS skeleton.utf8.md --to html4 --from markdown+autolink_bare_uris+tex_math_single_backslash+smart --output /home/agricolamz/work/packages/phonfieldwork/docs/s1/stimuli_viewer.html --email-obfuscation none --self-contained --standalone --section-divs --template /home/agricolamz/R/x86_64-pc-linux-gnu-library/3.6/rmarkdown/rmd/h/default.html --no-highlight --variable highlightjs=1 --variable &#39;theme:bootstrap&#39; --include-in-header /tmp/RtmpFDAPgN/rmarkdown-str1bf77cd00b6b.html --mathjax --variable &#39;mathjax-url:https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&#39; --metadata pagetitle=skeleton.utf8.md --lua-filter /home/agricolamz/R/x86_64-pc-linux-gnu-library/3.6/rmarkdown/rmd/lua/pagebreak.lua --lua-filter /home/agricolamz/R/x86_64-pc-linux-gnu-library/3.6/rmarkdown/rmd/lua/latex-div.lua</code></pre>
 <p>As a result, a <code>stimuli_viewer.html</code> was created in the <code>s1</code> folder.</p>
 <pre><code>## ├── s1
 ## │   ├── backup

diff --git a/docs/s1/stimuli_viewer.html b/docs/s1/stimuli_viewer.html
@@ -443,7 +443,7 @@
           theseArgs = theseArgs.concat([task.data]);
           task = task.code;
         }
-        var taskFunc = eval("(" + task + ")");
+        var taskFunc = tryEval(task);
         if (typeof(taskFunc) !== "function") {
           throw new Error("Task must be a function! Source:\n" + task);
         }
@@ -452,6 +452,31 @@
     }
   }
 
+  // Attempt eval() both with and without enclosing in parentheses.
+  // Note that enclosing coerces a function declaration into
+  // an expression that eval() can parse
+  // (otherwise, a SyntaxError is thrown)
+  function tryEval(code) {
+    var result = null;
+    try {
+      result = eval(code);
+    } catch(error) {
+      if (!error instanceof SyntaxError) {
+        throw error;
+      }
+      try {
+        result = eval("(" + code + ")");
+      } catch(e) {
+        if (e instanceof SyntaxError) {
+          throw error;
+        } else {
+          throw e;
+        }
+      }
+    }
+    return result;
+  }
+
   function initSizing(el) {
     var sizing = sizingPolicy(el);
     if (!sizing)
@@ -844,17 +869,56 @@
     invokePostRenderHandlers();
   }
 
-  // Wait until after the document has loaded to render the widgets.
+
+  function has_jQuery3() {
+    if (!window.jQuery) {
+      return false;
+    }
+    var $version = window.jQuery.fn.jquery;
+    var $major_version = parseInt($version.split(".")[0]);
+    return $major_version >= 3;
+  }
+
+  /*
+  / Shiny 1.4 bumped jQuery from 1.x to 3.x which means jQuery's
+  / on-ready handler (i.e., $(fn)) is now asyncronous (i.e., it now
+  / really means $(setTimeout(fn)).
+  / https://jquery.com/upgrade-guide/3.0/#breaking-change-document-ready-handlers-are-now-asynchronous
+  /
+  / Since Shiny uses $() to schedule initShiny, shiny>=1.4 calls initShiny
+  / one tick later than it did before, which means staticRender() is
+  / called renderValue() earlier than (advanced) widget authors might be expecting.
+  / https://github.com/rstudio/shiny/issues/2630
+  /
+  / For a concrete example, leaflet has some methods (e.g., updateBounds)
+  / which reference Shiny methods registered in initShiny (e.g., setInputValue).
+  / Since leaflet is privy to this life-cycle, it knows to use setTimeout() to
+  / delay execution of those methods (until Shiny methods are ready)
+  / https://github.com/rstudio/leaflet/blob/18ec981/javascript/src/index.js#L266-L268
+  /
+  / Ideally widget authors wouldn't need to use this setTimeout() hack that
+  / leaflet uses to call Shiny methods on a staticRender(). In the long run,
+  / the logic initShiny should be broken up so that method registration happens
+  / right away, but binding happens later.
+  */
+  function maybeStaticRenderLater() {
+    if (shinyMode && has_jQuery3()) {
+      window.jQuery(window.HTMLWidgets.staticRender);
+    } else {
+      window.HTMLWidgets.staticRender();
+    }
+  }
+
   if (document.addEventListener) {
     document.addEventListener("DOMContentLoaded", function() {
       document.removeEventListener("DOMContentLoaded", arguments.callee, false);
-      window.HTMLWidgets.staticRender();
+      maybeStaticRenderLater();
     }, false);
   } else if (document.attachEvent) {
     document.attachEvent("onreadystatechange", function() {
       if (document.readyState === "complete") {
         document.detachEvent("onreadystatechange", arguments.callee);
-        window.HTMLWidgets.staticRender();
+        maybeStaticRenderLater();
       }
     });
   }
@@ -942,7 +1006,7 @@
       if (o !== null && typeof o === "object" && part in o) {
         if (i == (l - 1)) { // if we are at the end of the line then evalulate
           if (typeof o[part] === "string")
-            o[part] = eval("(" + o[part] + ")");
+            o[part] = tryEval(o[part]);
         } else { // otherwise continue to next embedded object
           o = o[part];
         }
@@ -3098,8 +3162,8 @@
 }
 </style>
 <p><img id="expandedImg" style="position: fixed; top: 0; left: 900px; width:50%"></p>
-<div id="htmlwidget-24e7e9669decff13203f" style="width:100%;height:auto;" class="datatables html-widget"></div>
-<script type="application/json" data-for="htmlwidget-24e7e9669decff13203f">{"x":{"filter":"top","filterHTML":"<tr>\n  <td data-type=\"integer\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n    <div style=\"display: none; position: absolute; width: 200px;\">\n      <div data-min=\"1\" data-max=\"3\"><\/div>\n      <span style=\"float: left;\"><\/span>\n      <span style=\"float: right;\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n<\/tr>","data":[[1,2,3],["tip","tap","top"],["ı","æ","ɒ"],["<audio controls> <source src=\"s1_sounds/1_s1_ı.wav\" type=\"audio/wav\"><\/audio>","<audio controls> <source src=\"s1_sounds/2_s1_æ.wav\" type=\"audio/wav\"><\/audio>","<audio controls> <source src=\"s1_sounds/3_s1_ɒ.wav\" type=\"audio/wav\"><\/audio>"],["<img src=\"s1_pics/1_s1_ı.png\" style=\"width:10%\" onclick=\"myFunction(this);\">","<img src=\"s1_pics/2_s1_æ.png\" style=\"width:10%\" onclick=\"myFunction(this);\">","<img src=\"s1_pics/3_s1_ɒ.png\" style=\"width:10%\" onclick=\"myFunction(this);\">"]],"container":"<table class=\"display\">\n  <thead>\n    <tr>\n      <th>X<\/th>\n      <th>labels<\/th>\n      <th>X2<\/th>\n      <th>audio<\/th>\n      <th>pictures<\/th>\n    <\/tr>\n  <\/thead>\n<\/table>","options":{"pageLength":50,"dom":"tip","columnDefs":[{"className":"dt-right","targets":0}],"order":[],"autoWidth":false,"orderClasses":false,"orderCellsTop":true}},"evals":[],"jsHooks":[]}</script>
+<div id="htmlwidget-daa0ec7fdae1646a2ca5" style="width:100%;height:auto;" class="datatables html-widget"></div>
+<script type="application/json" data-for="htmlwidget-daa0ec7fdae1646a2ca5">{"x":{"filter":"top","filterHTML":"<tr>\n  <td data-type=\"integer\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n    <div style=\"display: none; position: absolute; width: 200px;\">\n      <div data-min=\"1\" data-max=\"3\"><\/div>\n      <span style=\"float: left;\"><\/span>\n      <span style=\"float: right;\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n  <td data-type=\"character\" style=\"vertical-align: top;\">\n    <div class=\"form-group has-feedback\" style=\"margin-bottom: auto;\">\n      <input type=\"search\" placeholder=\"All\" class=\"form-control\" style=\"width: 100%;\"/>\n      <span class=\"glyphicon glyphicon-remove-circle form-control-feedback\"><\/span>\n    <\/div>\n  <\/td>\n<\/tr>","data":[[1,2,3],["tip","tap","top"],["ı","æ","ɒ"],["<audio controls> <source src=\"s1_sounds/1_s1_ı.wav\" type=\"audio/wav\"><\/audio>","<audio controls> <source src=\"s1_sounds/2_s1_æ.wav\" type=\"audio/wav\"><\/audio>","<audio controls> <source src=\"s1_sounds/3_s1_ɒ.wav\" type=\"audio/wav\"><\/audio>"],["<img src=\"s1_pics/1_s1_ı.png\" style=\"width:10%\" onclick=\"myFunction(this);\">","<img src=\"s1_pics/2_s1_æ.png\" style=\"width:10%\" onclick=\"myFunction(this);\">","<img src=\"s1_pics/3_s1_ɒ.png\" style=\"width:10%\" onclick=\"myFunction(this);\">"]],"container":"<table class=\"display\">\n  <thead>\n    <tr>\n      <th>X<\/th>\n      <th>labels<\/th>\n      <th>X2<\/th>\n      <th>audio<\/th>\n      <th>pictures<\/th>\n    <\/tr>\n  <\/thead>\n<\/table>","options":{"pageLength":50,"dom":"tip","columnDefs":[{"className":"dt-right","targets":0}],"order":[],"autoWidth":false,"orderClasses":false,"orderCellsTop":true}},"evals":[],"jsHooks":[]}</script>
 <script>
 function myFunction(imgs) {
   var expandImg = document.getElementById("expandedImg");

diff --git a/man/create_presentation.Rd b/man/create_presentation.Rd
diff --git a/presentations/2019.11.15_HSE_School_of_Linguistics/2019.11.15_HSE_SL_about_phonfieldwork.pdf b/presentations/2019.11.15_HSE_School_of_Linguistics/2019.11.15_HSE_SL_about_phonfieldwork.pdf