From de7e71da6df1fac8abead59789161ccd7e4cbd83 Mon Sep 17 00:00:00 2001 From: davidruvolo51 Date: Tue, 16 Jun 2020 11:02:36 +0200 Subject: [PATCH] new function toggle_elem --- DESCRIPTION | 2 +- NAMESPACE | 1 + R/handlers.R | 29 +++++++++++++++++++++--- R/use_browsertools.R | 2 +- README.md | 26 ++------------------- inst/browsertools/js/browsertools.min.js | 2 +- inst/browsertools/js/index.js | 24 ++++++++++++++++++++ man/toggle_css.Rd | 9 ++++---- man/toggle_elem.Rd | 26 +++++++++++++++++++++ package.json | 2 +- 10 files changed, 87 insertions(+), 36 deletions(-) create mode 100644 man/toggle_elem.Rd diff --git a/DESCRIPTION b/DESCRIPTION index 5384b9c..02894b6 100644 --- a/DESCRIPTION +++ b/DESCRIPTION @@ -1,7 +1,7 @@ Package: browsertools Type: Package Title: a collection of js handlers and console tools -Version: 0.1.5 +Version: 0.1.6 Author: dcruvolo Maintainer: dcruvolo Description: This package provides a series of js handlers for diff --git a/NAMESPACE b/NAMESPACE index 0983f00..da321c5 100644 --- a/NAMESPACE +++ b/NAMESPACE @@ -22,6 +22,7 @@ export("scroll_to") export("set_element_attribute") export("show_elem") export("toggle_css") +export("toggle_elem") importFrom(htmltools, htmlDependency) importFrom(shiny, getDefaultReactiveDomain, removeResourcePath, addResourcePath, observeEvent, runApp) importFrom(jsonlite, fromJSON) diff --git a/R/handlers.R b/R/handlers.R index f57bead..2f91750 100644 --- a/R/handlers.R +++ b/R/handlers.R @@ -424,9 +424,8 @@ show_elem <- function(elem, css = "browsertools-hidden") { #' Toggles a css state of an html element #' @return Toggles a css state of an html element #' @param elem the id or class name of an html element -#' @param css a string containing the class to remove from -#' an html element -#' @keywords browsertools, attribute, value +#' @param css a string containing the class to remove from an html element +#' @keywords browsertools toggle css #' @examples #' toggle_css(elem = "#mydiv", css = "mytheme") #' @references \url{https://developer.mozilla.org/en-US/docs/Web/API/DOMTokenList/toggle} @@ -441,4 +440,28 @@ toggle_css <- function(elem, css) { # send session <- getDefaultReactiveDomain() session$sendCustomMessage("toggle_css", list(elem = elem, css = css)) +} + + +#' \code{toggle_elem} +#' +#' Toggle the visibility of an html element +#' @return Toggle the visibility of an html element +#' @param elem the id or class name of an html element +#' @param css a string containing the class to remove from an html element +#' (default: browsertools-hidden; package default) +#' @keywords browsertools toggle element +#' @examples +#' toggle_elem(elem = "#mydiv") +#' @importFrom shiny getDefaultReactiveDomain +#' @export +toggle_elem <- function(elem, css = "browsertools-hidden") { + + # validate + if (is.null(elem)) stop("argument 'elem' is undefined") + if (is.null(css)) stop("argument 'css' is undefined") + + # send + session <- getDefaultReactiveDomain() + session$sendCustomMessage("toggle_elem", list(elem = elem, css = css)) } \ No newline at end of file diff --git a/R/use_browsertools.R b/R/use_browsertools.R index 169e637..a4579d8 100644 --- a/R/use_browsertools.R +++ b/R/use_browsertools.R @@ -9,7 +9,7 @@ use_browsertools <- function() { htmlDependency( name = "browsertools", - version = "0.1.5", + version = "0.1.6", src = "browsertools/", package = "browsertools", script = "js/browsertools.min.js", diff --git a/README.md b/README.md index 7e65286..677af81 100644 --- a/README.md +++ b/README.md @@ -59,6 +59,7 @@ This package offers the following functions. With the exception of the `use_brow | `scroll_to` | `x`, `y` | scroll to a position in a page (default: `0, 0` = top of document) | `show_elem` | `elem`, `css` | show an element by removing a class name or `hidden` | `toggle_css` | `elem`, `css` | toggle a css class +| `toggle_elem` | `elem`, `css` | toggle the visibility of an element ## Development @@ -93,27 +94,4 @@ When all changes are made and the css/js files are built, you can build the pack yarn uninstall # uninstalls pkg yarn document # builds pkg documentation yarn package # builds and installs pkg -``` - - -### Dependencies - -This package uses the following R dependencies. - -- htmltools (>= 0.4.0): htmlDependency -- shiny (>= 1.4.0): getDefaultReactiveDomain, removeResourcePath, addResourcePath, observeEvent -- jsonlite (>= 1.6.0): fromJSON -- rlang (>= 0.4.6): list2 -- purrr (>= 0.3.4): map - -And the following dev dependencies - -- @babel/cli: ^7.8.3, -- @babel/core: ^7.9.6, -- @babel/preset-env: ^7.9.6, -- autoprefixer: ^9.7.6, -- babel-preset-minify: ^0.5.1, -- cssnano: ^4.1.10, -- parcel: 1.12.4, -- postcss-modules: ^2.0.0, -- sass: ^1.26.5 +``` \ No newline at end of file diff --git a/inst/browsertools/js/browsertools.min.js b/inst/browsertools/js/browsertools.min.js index 4d33201..d3b8d75 100644 --- a/inst/browsertools/js/browsertools.min.js +++ b/inst/browsertools/js/browsertools.min.js @@ -1,3 +1,3 @@ parcelRequire=function(e,r,t,n){var i,o="function"==typeof parcelRequire&&parcelRequire,u="function"==typeof require&&require;function f(t,n){if(!r[t]){if(!e[t]){var i="function"==typeof parcelRequire&&parcelRequire;if(!n&&i)return i(t,!0);if(o)return o(t,!0);if(u&&"string"==typeof t)return u(t);var c=new Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}p.resolve=function(r){return e[t][1][r]||r},p.cache={};var l=r[t]=new f.Module(t);e[t][0].call(l.exports,p,l,l.exports,this)}return r[t].exports;function p(e){return f(p.resolve(e))}}f.isParcelRequire=!0,f.Module=function(e){this.id=e,this.bundle=f,this.exports={}},f.modules=e,f.cache=r,f.parent=o,f.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]};for(var c=0;ce.length)&&(t=e.length);for(var n=0,r=new Array(t);n-1?p(t,n):y(t,n)}catch(r){a("toggle_elem",r)}}Shiny.addCustomMessageHandler("browsertools_debug",function(e){c.debug=e.debug}),Shiny.addCustomMessageHandler("add_css",function(e){i(e.elem,e.css,e.debug)}),Shiny.addCustomMessageHandler("alert",function(e){alert(e.message)}),Shiny.addCustomMessageHandler("console_error",function(e){u(e)}),Shiny.addCustomMessageHandler("console_log",function(e){l(e.message,e.expand)}),Shiny.addCustomMessageHandler("console_table",function(e){d(e)}),Shiny.addCustomMessageHandler("console_warn",function(e){m(e)}),Shiny.addCustomMessageHandler("hide_elem",function(e){y(e.elem,e.css)}),Shiny.addCustomMessageHandler("inner_html",function(e){f(e.elem,e.string,e.append,e.delay)}),Shiny.addCustomMessageHandler("inner_text",function(e){g(e.elem,e.string,e.append,e.delay)}),Shiny.addCustomMessageHandler("insert_adjacent_html",function(e){h(e.id,e.html,e.position)}),Shiny.addCustomMessageHandler("print_elem",function(e){S(e.elem)}),Shiny.addCustomMessageHandler("refresh_page",function(e){_(e)}),Shiny.addCustomMessageHandler("remove_css",function(e){b(e.elem,e.css)}),Shiny.addCustomMessageHandler("remove_element",function(e){M(e.elem)}),Shiny.addCustomMessageHandler("remove_element_attribute",function(e){H(e.elem,e.attr)}),Shiny.addCustomMessageHandler("set_element_attribute",function(e){v(e.elem,e.attr,e.value)}),Shiny.addCustomMessageHandler("show_elem",function(e){p(e.elem,e.css)}),Shiny.addCustomMessageHandler("scroll_to",function(e){C(e.x,e.y,e.elem)}),Shiny.addCustomMessageHandler("toggle_css",function(e){q(e.elem,e.css)}),Shiny.addCustomMessageHandler("toggle_elem",function(e){w(e.elem,e.css)}); },{}]},{},["Focm"], null) \ No newline at end of file diff --git a/inst/browsertools/js/index.js b/inst/browsertools/js/index.js index 369e737..2f4e793 100644 --- a/inst/browsertools/js/index.js +++ b/inst/browsertools/js/index.js @@ -383,4 +383,28 @@ function toggle_css(elem, css) { // register Shiny.addCustomMessageHandler("toggle_css", function (value) { toggle_css(value.elem, value.css); +}); + +//////////////////////////////////////// + +// TOGGLE ELEMENT +// @param elem: an element to select (e.g., ID, class, tag, etc.) +// @param css: a css class to add/remove (visibility class) +function toggle_elem(elem, css) { + try { + let el = document.querySelector(elem); + // if hidden, then unhide. Else, hide. + if ([...el.classList].indexOf(css) > -1) { + show_elem(elem, css); + } else { + hide_elem(elem, css); + } + } catch (e) { + send_error("toggle_elem", e); + } +} + +// register +Shiny.addCustomMessageHandler("toggle_elem", function (value) { + toggle_elem(value.elem, value.css); }); \ No newline at end of file diff --git a/man/toggle_css.Rd b/man/toggle_css.Rd index c01eb26..c3b3289 100644 --- a/man/toggle_css.Rd +++ b/man/toggle_css.Rd @@ -9,8 +9,7 @@ toggle_css(elem, css) \arguments{ \item{elem}{the id or class name of an html element} -\item{css}{a string containing the class to remove from -an html element} +\item{css}{a string containing the class to remove from an html element} } \value{ Toggles a css state of an html element @@ -24,6 +23,6 @@ toggle_css(elem = "#mydiv", css = "mytheme") \references{ \url{https://developer.mozilla.org/en-US/docs/Web/API/DOMTokenList/toggle} } -\keyword{attribute,} -\keyword{browsertools,} -\keyword{value} +\keyword{browsertools} +\keyword{css} +\keyword{toggle} diff --git a/man/toggle_elem.Rd b/man/toggle_elem.Rd new file mode 100644 index 0000000..434fd96 --- /dev/null +++ b/man/toggle_elem.Rd @@ -0,0 +1,26 @@ +% Generated by roxygen2: do not edit by hand +% Please edit documentation in R/handlers.R +\name{toggle_elem} +\alias{toggle_elem} +\title{\code{toggle_elem}} +\usage{ +toggle_elem(elem, css = "browsertools-hidden") +} +\arguments{ +\item{elem}{the id or class name of an html element} + +\item{css}{a string containing the class to remove from an html element +(default: browsertools-hidden; package default)} +} +\value{ +Toggle the visibility of an html element +} +\description{ +Toggle the visibility of an html element +} +\examples{ +toggle_elem(elem = "#mydiv") +} +\keyword{browsertools} +\keyword{element} +\keyword{toggle} diff --git a/package.json b/package.json index 5aa3ce9..0d1e422 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "browsertools", - "version": "0.1.5", + "version": "0.1.6", "author": "dcruvolo", "license": "ISC", "description": "a collection of tools for use in shiny",