├── .Rbuildignore ├── .github ├── .gitignore ├── FUNDING.yml └── workflows │ └── R-CMD-check.yaml ├── .gitignore ├── CODE_OF_CONDUCT.md ├── DESCRIPTION ├── LICENSE ├── LICENSE.md ├── NAMESPACE ├── NEWS.md ├── R └── bubbly.R ├── README.Rmd ├── README.md ├── bubblyr.Rproj ├── cran-comments.md ├── man ├── bubbly.Rd └── figures │ ├── bigmom.gif │ ├── classy.gif │ ├── hex.png │ ├── lalalandexample.gif │ └── rstudio.gif └── vignettes ├── .gitignore └── Introduction.Rmd /.Rbuildignore: -------------------------------------------------------------------------------- 1 | ^.*\.Rproj$ 2 | ^\.Rproj\.user$ 3 | ^LICENSE\.md$ 4 | ^README\.Rmd$ 5 | ^CODE_OF_CONDUCT\.md$ 6 | ^cran-comments\.md$ 7 | ^CRAN-RELEASE$ 8 | ^\.github$ 9 | -------------------------------------------------------------------------------- /.github/.gitignore: -------------------------------------------------------------------------------- 1 | *.html 2 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | custom: ['https://www.buymeacoffee.com/Fodil'] 2 | -------------------------------------------------------------------------------- /.github/workflows/R-CMD-check.yaml: -------------------------------------------------------------------------------- 1 | # For help debugging build failures open an issue on the RStudio community with the 'github-actions' tag. 2 | # https://community.rstudio.com/new-topic?category=Package%20development&tags=github-actions 3 | on: 4 | push: 5 | branches: 6 | - main 7 | - master 8 | pull_request: 9 | branches: 10 | - main 11 | - master 12 | 13 | name: R-CMD-check 14 | 15 | jobs: 16 | R-CMD-check: 17 | runs-on: ${{ matrix.config.os }} 18 | 19 | name: ${{ matrix.config.os }} (${{ matrix.config.r }}) 20 | 21 | strategy: 22 | fail-fast: false 23 | matrix: 24 | config: 25 | - {os: windows-latest, r: 'release'} 26 | - {os: macOS-latest, r: 'release'} 27 | - {os: ubuntu-20.04, r: 'release', rspm: "https://packagemanager.rstudio.com/cran/__linux__/focal/latest"} 28 | - {os: ubuntu-20.04, r: 'devel', rspm: "https://packagemanager.rstudio.com/cran/__linux__/focal/latest"} 29 | 30 | env: 31 | R_REMOTES_NO_ERRORS_FROM_WARNINGS: true 32 | RSPM: ${{ matrix.config.rspm }} 33 | GITHUB_PAT: ${{ secrets.GITHUB_TOKEN }} 34 | 35 | steps: 36 | - uses: actions/checkout@v2 37 | 38 | - uses: r-lib/actions/setup-r@v1 39 | with: 40 | r-version: ${{ matrix.config.r }} 41 | 42 | - uses: r-lib/actions/setup-pandoc@v1 43 | 44 | - name: Query dependencies 45 | run: | 46 | install.packages('remotes') 47 | saveRDS(remotes::dev_package_deps(dependencies = TRUE), ".github/depends.Rds", version = 2) 48 | writeLines(sprintf("R-%i.%i", getRversion()$major, getRversion()$minor), ".github/R-version") 49 | shell: Rscript {0} 50 | 51 | - name: Cache R packages 52 | if: runner.os != 'Windows' 53 | uses: actions/cache@v2 54 | with: 55 | path: ${{ env.R_LIBS_USER }} 56 | key: ${{ runner.os }}-${{ hashFiles('.github/R-version') }}-1-${{ hashFiles('.github/depends.Rds') }} 57 | restore-keys: ${{ runner.os }}-${{ hashFiles('.github/R-version') }}-1- 58 | 59 | - name: Install system dependencies 60 | if: runner.os == 'Linux' 61 | run: | 62 | while read -r cmd 63 | do 64 | eval sudo $cmd 65 | done < <(Rscript -e 'writeLines(remotes::system_requirements("ubuntu", "20.04"))') 66 | 67 | - name: Install dependencies 68 | run: | 69 | remotes::install_deps(dependencies = TRUE) 70 | remotes::install_cran("rcmdcheck") 71 | shell: Rscript {0} 72 | 73 | - name: Check 74 | env: 75 | _R_CHECK_CRAN_INCOMING_REMOTE_: false 76 | run: rcmdcheck::rcmdcheck(args = c("--no-manual", "--as-cran"), error_on = "warning", check_dir = "check") 77 | shell: Rscript {0} 78 | 79 | - name: Upload check results 80 | if: failure() 81 | uses: actions/upload-artifact@main 82 | with: 83 | name: ${{ runner.os }}-r${{ matrix.config.r }}-results 84 | path: check 85 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .Rproj.user 2 | .Rhistory 3 | .RData 4 | .Ruserdata 5 | inst/doc 6 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | We as members, contributors, and leaders pledge to make participation in our 6 | community a harassment-free experience for everyone, regardless of age, body 7 | size, visible or invisible disability, ethnicity, sex characteristics, gender 8 | identity and expression, level of experience, education, socio-economic status, 9 | nationality, personal appearance, race, religion, or sexual identity and 10 | orientation. 11 | 12 | We pledge to act and interact in ways that contribute to an open, welcoming, 13 | diverse, inclusive, and healthy community. 14 | 15 | ## Our Standards 16 | 17 | Examples of behavior that contributes to a positive environment for our 18 | community include: 19 | 20 | * Demonstrating empathy and kindness toward other people 21 | * Being respectful of differing opinions, viewpoints, and experiences 22 | * Giving and gracefully accepting constructive feedback 23 | * Accepting responsibility and apologizing to those affected by our mistakes, 24 | and learning from the experience 25 | * Focusing on what is best not just for us as individuals, but for the overall 26 | community 27 | 28 | Examples of unacceptable behavior include: 29 | 30 | * The use of sexualized language or imagery, and sexual attention or 31 | advances of any kind 32 | * Trolling, insulting or derogatory comments, and personal or political attacks 33 | * Public or private harassment 34 | * Publishing others' private information, such as a physical or email 35 | address, without their explicit permission 36 | * Other conduct which could reasonably be considered inappropriate in a 37 | professional setting 38 | 39 | ## Enforcement Responsibilities 40 | 41 | Community leaders are responsible for clarifying and enforcing our standards 42 | of acceptable behavior and will take appropriate and fair corrective action in 43 | response to any behavior that they deem inappropriate, threatening, offensive, 44 | or harmful. 45 | 46 | Community leaders have the right and responsibility to remove, edit, or reject 47 | comments, commits, code, wiki edits, issues, and other contributions that are 48 | not aligned to this Code of Conduct, and will communicate reasons for moderation 49 | decisions when appropriate. 50 | 51 | ## Scope 52 | 53 | This Code of Conduct applies within all community spaces, and also applies 54 | when an individual is officially representing the community in public spaces. 55 | Examples of representing our community include using an official e-mail 56 | address, posting via an official social media account, or acting as an appointed 57 | representative at an online or offline event. 58 | 59 | ## Enforcement 60 | 61 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 62 | reported to the community leaders responsible for enforcement at [INSERT CONTACT 63 | METHOD]. All complaints will be reviewed and investigated promptly and fairly. 64 | 65 | All community leaders are obligated to respect the privacy and security of the 66 | reporter of any incident. 67 | 68 | ## Enforcement Guidelines 69 | 70 | Community leaders will follow these Community Impact Guidelines in determining 71 | the consequences for any action they deem in violation of this Code of Conduct: 72 | 73 | ### 1. Correction 74 | 75 | **Community Impact**: Use of inappropriate language or other behavior deemed 76 | unprofessional or unwelcome in the community. 77 | 78 | **Consequence**: A private, written warning from community leaders, providing 79 | clarity around the nature of the violation and an explanation of why the 80 | behavior was inappropriate. A public apology may be requested. 81 | 82 | ### 2. Warning 83 | 84 | **Community Impact**: A violation through a single incident or series of 85 | actions. 86 | 87 | **Consequence**: A warning with consequences for continued behavior. No 88 | interaction with the people involved, including unsolicited interaction with 89 | those enforcing the Code of Conduct, for a specified period of time. This 90 | includes avoiding interactions in community spaces as well as external channels 91 | like social media. Violating these terms may lead to a temporary or permanent 92 | ban. 93 | 94 | ### 3. Temporary Ban 95 | 96 | **Community Impact**: A serious violation of community standards, including 97 | sustained inappropriate behavior. 98 | 99 | **Consequence**: A temporary ban from any sort of interaction or public 100 | communication with the community for a specified period of time. No public or 101 | private interaction with the people involved, including unsolicited interaction 102 | with those enforcing the Code of Conduct, is allowed during this period. 103 | Violating these terms may lead to a permanent ban. 104 | 105 | ### 4. Permanent Ban 106 | 107 | **Community Impact**: Demonstrating a pattern of violation of community 108 | standards, including sustained inappropriate behavior, harassment of an 109 | individual, or aggression toward or disparagement of classes of individuals. 110 | 111 | **Consequence**: A permanent ban from any sort of public interaction within the 112 | community. 113 | 114 | ## Attribution 115 | 116 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], 117 | version 2.0, 118 | available at https://www.contributor-covenant.org/version/2/0/ 119 | code_of_conduct.html. 120 | 121 | Community Impact Guidelines were inspired by [Mozilla's code of conduct 122 | enforcement ladder](https://github.com/mozilla/diversity). 123 | 124 | [homepage]: https://www.contributor-covenant.org 125 | 126 | For answers to common questions about this code of conduct, see the FAQ at 127 | https://www.contributor-covenant.org/faq. Translations are available at https:// 128 | www.contributor-covenant.org/translations. 129 | -------------------------------------------------------------------------------- /DESCRIPTION: -------------------------------------------------------------------------------- 1 | Package: bubblyr 2 | Title: Beautiful Bubbles for 'shiny' and 'rmarkdown' Backgrounds 3 | Version: 0.1.2 4 | Authors@R: 5 | c(person(given = "Mohamed El Fodil", 6 | family = "Ihaddaden", 7 | role = c("aut", "cre"), 8 | email = "ihaddaden.fodeil@gmail.com"), 9 | person(given = "David", 10 | family = "Åse", 11 | role = "cph", 12 | comment = "bubbly-bg library") 13 | ) 14 | Description: Creates bubbles within 'shiny' and 'rmarkdown' backgrounds using the 'bubbly-bg' 'JavaScript' library. 15 | License: MIT + file LICENSE 16 | Encoding: UTF-8 17 | LazyData: true 18 | Roxygen: list(markdown = TRUE) 19 | RoxygenNote: 7.1.1 20 | Imports: 21 | htmltools, 22 | glue 23 | Suggests: 24 | knitr, 25 | rmarkdown 26 | VignetteBuilder: knitr 27 | URL: https://github.com/feddelegrand7/bubblyr 28 | BugReports: https://github.com/feddelegrand7/bubblyr/issues 29 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | YEAR: 2020 2 | COPYRIGHT HOLDER: Mohamed El Fodil Ihaddaden 3 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The bubblyr package is distributed under MIT License. 2 | 3 | The bubblyr package relies on the bubby-bg JavaScript library which is distributed under Apache License 2.0 (see below). 4 | 5 | 6 | # MIT License 7 | 8 | Copyright (c) 2020 Mohamed El Fodil Ihaddaden 9 | 10 | Permission is hereby granted, free of charge, to any person obtaining a copy 11 | of this software and associated documentation files (the "Software"), to deal 12 | in the Software without restriction, including without limitation the rights 13 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 14 | copies of the Software, and to permit persons to whom the Software is 15 | furnished to do so, subject to the following conditions: 16 | 17 | The above copyright notice and this permission notice shall be included in all 18 | copies or substantial portions of the Software. 19 | 20 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 21 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 22 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 23 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 24 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 25 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 26 | SOFTWARE. 27 | 28 | # bubby-bg 29 | 30 | Apache License 31 | Version 2.0, January 2004 32 | http://www.apache.org/licenses/ 33 | 34 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 35 | 36 | 1. Definitions. 37 | 38 | "License" shall mean the terms and conditions for use, reproduction, 39 | and distribution as defined by Sections 1 through 9 of this document. 40 | 41 | "Licensor" shall mean the copyright owner or entity authorized by 42 | the copyright owner that is granting the License. 43 | 44 | "Legal Entity" shall mean the union of the acting entity and all 45 | other entities that control, are controlled by, or are under common 46 | control with that entity. For the purposes of this definition, 47 | "control" means (i) the power, direct or indirect, to cause the 48 | direction or management of such entity, whether by contract or 49 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 50 | outstanding shares, or (iii) beneficial ownership of such entity. 51 | 52 | "You" (or "Your") shall mean an individual or Legal Entity 53 | exercising permissions granted by this License. 54 | 55 | "Source" form shall mean the preferred form for making modifications, 56 | including but not limited to software source code, documentation 57 | source, and configuration files. 58 | 59 | "Object" form shall mean any form resulting from mechanical 60 | transformation or translation of a Source form, including but 61 | not limited to compiled object code, generated documentation, 62 | and conversions to other media types. 63 | 64 | "Work" shall mean the work of authorship, whether in Source or 65 | Object form, made available under the License, as indicated by a 66 | copyright notice that is included in or attached to the work 67 | (an example is provided in the Appendix below). 68 | 69 | "Derivative Works" shall mean any work, whether in Source or Object 70 | form, that is based on (or derived from) the Work and for which the 71 | editorial revisions, annotations, elaborations, or other modifications 72 | represent, as a whole, an original work of authorship. For the purposes 73 | of this License, Derivative Works shall not include works that remain 74 | separable from, or merely link (or bind by name) to the interfaces of, 75 | the Work and Derivative Works thereof. 76 | 77 | "Contribution" shall mean any work of authorship, including 78 | the original version of the Work and any modifications or additions 79 | to that Work or Derivative Works thereof, that is intentionally 80 | submitted to Licensor for inclusion in the Work by the copyright owner 81 | or by an individual or Legal Entity authorized to submit on behalf of 82 | the copyright owner. For the purposes of this definition, "submitted" 83 | means any form of electronic, verbal, or written communication sent 84 | to the Licensor or its representatives, including but not limited to 85 | communication on electronic mailing lists, source code control systems, 86 | and issue tracking systems that are managed by, or on behalf of, the 87 | Licensor for the purpose of discussing and improving the Work, but 88 | excluding communication that is conspicuously marked or otherwise 89 | designated in writing by the copyright owner as "Not a Contribution." 90 | 91 | "Contributor" shall mean Licensor and any individual or Legal Entity 92 | on behalf of whom a Contribution has been received by Licensor and 93 | subsequently incorporated within the Work. 94 | 95 | 2. Grant of Copyright License. Subject to the terms and conditions of 96 | this License, each Contributor hereby grants to You a perpetual, 97 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 98 | copyright license to reproduce, prepare Derivative Works of, 99 | publicly display, publicly perform, sublicense, and distribute the 100 | Work and such Derivative Works in Source or Object form. 101 | 102 | 3. Grant of Patent License. Subject to the terms and conditions of 103 | this License, each Contributor hereby grants to You a perpetual, 104 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 105 | (except as stated in this section) patent license to make, have made, 106 | use, offer to sell, sell, import, and otherwise transfer the Work, 107 | where such license applies only to those patent claims licensable 108 | by such Contributor that are necessarily infringed by their 109 | Contribution(s) alone or by combination of their Contribution(s) 110 | with the Work to which such Contribution(s) was submitted. If You 111 | institute patent litigation against any entity (including a 112 | cross-claim or counterclaim in a lawsuit) alleging that the Work 113 | or a Contribution incorporated within the Work constitutes direct 114 | or contributory patent infringement, then any patent licenses 115 | granted to You under this License for that Work shall terminate 116 | as of the date such litigation is filed. 117 | 118 | 4. Redistribution. You may reproduce and distribute copies of the 119 | Work or Derivative Works thereof in any medium, with or without 120 | modifications, and in Source or Object form, provided that You 121 | meet the following conditions: 122 | 123 | (a) You must give any other recipients of the Work or 124 | Derivative Works a copy of this License; and 125 | 126 | (b) You must cause any modified files to carry prominent notices 127 | stating that You changed the files; and 128 | 129 | (c) You must retain, in the Source form of any Derivative Works 130 | that You distribute, all copyright, patent, trademark, and 131 | attribution notices from the Source form of the Work, 132 | excluding those notices that do not pertain to any part of 133 | the Derivative Works; and 134 | 135 | (d) If the Work includes a "NOTICE" text file as part of its 136 | distribution, then any Derivative Works that You distribute must 137 | include a readable copy of the attribution notices contained 138 | within such NOTICE file, excluding those notices that do not 139 | pertain to any part of the Derivative Works, in at least one 140 | of the following places: within a NOTICE text file distributed 141 | as part of the Derivative Works; within the Source form or 142 | documentation, if provided along with the Derivative Works; or, 143 | within a display generated by the Derivative Works, if and 144 | wherever such third-party notices normally appear. The contents 145 | of the NOTICE file are for informational purposes only and 146 | do not modify the License. You may add Your own attribution 147 | notices within Derivative Works that You distribute, alongside 148 | or as an addendum to the NOTICE text from the Work, provided 149 | that such additional attribution notices cannot be construed 150 | as modifying the License. 151 | 152 | You may add Your own copyright statement to Your modifications and 153 | may provide additional or different license terms and conditions 154 | for use, reproduction, or distribution of Your modifications, or 155 | for any such Derivative Works as a whole, provided Your use, 156 | reproduction, and distribution of the Work otherwise complies with 157 | the conditions stated in this License. 158 | 159 | 5. Submission of Contributions. Unless You explicitly state otherwise, 160 | any Contribution intentionally submitted for inclusion in the Work 161 | by You to the Licensor shall be under the terms and conditions of 162 | this License, without any additional terms or conditions. 163 | Notwithstanding the above, nothing herein shall supersede or modify 164 | the terms of any separate license agreement you may have executed 165 | with Licensor regarding such Contributions. 166 | 167 | 6. Trademarks. This License does not grant permission to use the trade 168 | names, trademarks, service marks, or product names of the Licensor, 169 | except as required for reasonable and customary use in describing the 170 | origin of the Work and reproducing the content of the NOTICE file. 171 | 172 | 7. Disclaimer of Warranty. Unless required by applicable law or 173 | agreed to in writing, Licensor provides the Work (and each 174 | Contributor provides its Contributions) on an "AS IS" BASIS, 175 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 176 | implied, including, without limitation, any warranties or conditions 177 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 178 | PARTICULAR PURPOSE. You are solely responsible for determining the 179 | appropriateness of using or redistributing the Work and assume any 180 | risks associated with Your exercise of permissions under this License. 181 | 182 | 8. Limitation of Liability. In no event and under no legal theory, 183 | whether in tort (including negligence), contract, or otherwise, 184 | unless required by applicable law (such as deliberate and grossly 185 | negligent acts) or agreed to in writing, shall any Contributor be 186 | liable to You for damages, including any direct, indirect, special, 187 | incidental, or consequential damages of any character arising as a 188 | result of this License or out of the use or inability to use the 189 | Work (including but not limited to damages for loss of goodwill, 190 | work stoppage, computer failure or malfunction, or any and all 191 | other commercial damages or losses), even if such Contributor 192 | has been advised of the possibility of such damages. 193 | 194 | 9. Accepting Warranty or Additional Liability. While redistributing 195 | the Work or Derivative Works thereof, You may choose to offer, 196 | and charge a fee for, acceptance of support, warranty, indemnity, 197 | or other liability obligations and/or rights consistent with this 198 | License. However, in accepting such obligations, You may act only 199 | on Your own behalf and on Your sole responsibility, not on behalf 200 | of any other Contributor, and only if You agree to indemnify, 201 | defend, and hold each Contributor harmless for any liability 202 | incurred by, or claims asserted against, such Contributor by reason 203 | of your accepting any such warranty or additional liability. 204 | 205 | END OF TERMS AND CONDITIONS 206 | 207 | APPENDIX: How to apply the Apache License to your work. 208 | 209 | To apply the Apache License to your work, attach the following 210 | boilerplate notice, with the fields enclosed by brackets "{}" 211 | replaced with your own identifying information. (Don't include 212 | the brackets!) The text should be enclosed in the appropriate 213 | comment syntax for the file format. We also recommend that a 214 | file or class name and description of purpose be included on the 215 | same "printed page" as the copyright notice for easier 216 | identification within third-party archives. 217 | 218 | Copyright 2017 David Åse 219 | 220 | Licensed under the Apache License, Version 2.0 (the "License"); 221 | you may not use this file except in compliance with the License. 222 | You may obtain a copy of the License at 223 | 224 | http://www.apache.org/licenses/LICENSE-2.0 225 | 226 | Unless required by applicable law or agreed to in writing, software 227 | distributed under the License is distributed on an "AS IS" BASIS, 228 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 229 | See the License for the specific language governing permissions and 230 | limitations under the License. 231 | 232 | 233 | -------------------------------------------------------------------------------- /NAMESPACE: -------------------------------------------------------------------------------- 1 | exportPattern("^[[:alpha:]]+") 2 | -------------------------------------------------------------------------------- /NEWS.md: -------------------------------------------------------------------------------- 1 | # bubblyr 0.1.2 2 | 3 | # bubblyr 0.1.1 4 | 5 | - I've added new themes: "gravitas", "rladies", "sunshine", "sweet" 6 | - I've added the License of the bubbly-bg JS Library. 7 | 8 | # bubblyr 0.1.0 9 | 10 | * First publication on CRAN. 11 | -------------------------------------------------------------------------------- /R/bubbly.R: -------------------------------------------------------------------------------- 1 | 2 | 3 | #' Add beautiful interactive bubbles within Shing and RMarkdown backgrounds 4 | #' 5 | #' @param theme Name of the bubbles theme. See the vignette for a list of themes. 6 | #' @param color Text color. Defaults to 'white' 7 | #' 8 | #' @return Themed interactive bubbles for Shiny and RMarkdown backgrounds 9 | #' @export 10 | #' 11 | #' @examples 12 | #' if (interactive()) { 13 | #' 14 | #' ui <- fluidPage( 15 | #' 16 | #' bubbly(theme = "meteor") 17 | #' 18 | #' ) 19 | #' 20 | #' 21 | #' server <- function(input, output) {} 22 | #' 23 | #' 24 | #' 25 | #' shinyApp(ui = ui, server = server) 26 | #' 27 | #' 28 | # 29 | #' 30 | #' 31 | #' } 32 | #' 33 | #' 34 | 35 | 36 | bubbly <- function(theme = "ocean", color = "white") { 37 | if (!theme %in% c( 38 | "ocean", 39 | "cherry", 40 | "hippie", 41 | "bigmom", 42 | "deepsea", 43 | "illusion", 44 | "rstudio", 45 | "ash", 46 | "classy", 47 | "volcano", 48 | "lacoste", 49 | "warmup", 50 | "fire", 51 | "traffic", 52 | "life", 53 | "darksky", 54 | "orangina", 55 | "meteor", 56 | "gravitas", 57 | "rladies", 58 | "sunshine", 59 | "sweet", 60 | "lalaland" 61 | 62 | )) { 63 | stop(paste0(theme, " theme is not available, did you misspelled the theme ?")) 64 | } 65 | 66 | 67 | if (theme == "ocean") { 68 | htmltools::tagList( 69 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 70 | 71 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 72 | 73 | htmltools::tags$script(htmltools::HTML("bubbly();")) 74 | 75 | 76 | ) 77 | 78 | 79 | } else if (theme == "cherry") { 80 | htmltools::tagList( 81 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 82 | 83 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 84 | 85 | 86 | htmltools::tags$script( 87 | htmltools::HTML( 88 | "bubbly({colorStart: '#111',colorStop: '#422',bubbleFunc: () => `hsla(0, 100%, 50%, ${Math.random() * 0.25})`});" 89 | 90 | 91 | 92 | ) 93 | ) 94 | 95 | 96 | ) 97 | 98 | 99 | } else if (theme == "hippie") { 100 | htmltools::tagList( 101 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 102 | 103 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 104 | 105 | 106 | htmltools::tags$script( 107 | htmltools::HTML( 108 | "bubbly({colorStart: '#4c004c',colorStop: '#1a001a',bubbleFunc: () => `hsla(${Math.random() * 360}, 100%, 50%, ${Math.random() * 0.25})`});" 109 | 110 | 111 | 112 | ) 113 | ) 114 | 115 | 116 | ) 117 | 118 | 119 | 120 | } else if (theme == "bigmom") { 121 | htmltools::tagList( 122 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 123 | 124 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 125 | 126 | 127 | htmltools::tags$script( 128 | htmltools::HTML( 129 | "bubbly({colorStart: '#fff4e6', colorStop: '#ffe9e4', blur: 1, compose: 'source-over', bubbleFunc: () => `hsla(${Math.random() * 50}, 100%, 50%, .3)`});" 130 | 131 | 132 | ) 133 | ) 134 | 135 | 136 | ) 137 | 138 | 139 | 140 | } else if (theme == "deepsea") { 141 | htmltools::tagList( 142 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 143 | 144 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 145 | 146 | htmltools::tags$script( 147 | htmltools::HTML( 148 | "bubbly({blur:15, colorStart: '#194167', colorStop: '#112144', radiusFunc:() => 5 + Math.random() * 15, angleFunc:() => -Math.PI / 2, velocityFunc:() => Math.random() * 1.5, bubbleFunc:() => `hsla(${200 + Math.random() * 50}, 100%, 65%, .1)`,bubbles:350});" 149 | 150 | 151 | ) 152 | ) 153 | 154 | 155 | ) 156 | 157 | 158 | 159 | } else if (theme == "illusion") { 160 | htmltools::tagList( 161 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 162 | 163 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 164 | 165 | 166 | htmltools::tags$script( 167 | htmltools::HTML( 168 | " 169 | 170 | bubbly({ 171 | animate: true, // default is true 172 | blur: 1, // default is 4 173 | bubbleFunc: () => `hsla(${Math.random() * 360}, 100%, 50%, ${Math.random() * 0.25})`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 174 | bubbles: 1000, // default is Math.floor((canvas.width + canvas.height) * 0.02); 175 | canvas: document.querySelector('#background'), // default is created and attached 176 | colorStart: '#ad0e8d', // default is blue-ish 177 | colorStop: '#7d00d1',// default is blue-ish 178 | compose: 'lighter', // default is 'lighter' 179 | shadowColor: '#0ff', // default is #fff 180 | angleFunc: () => Math.random() * Math.PI * 2, // default is this 181 | velocityFunc: () => 0.5 + Math.random() * 0.5, // default is this 182 | radiusFunc: () => 8 + Math.random() * 25 // default is 4 + Math.random() * width / 25 183 | }); 184 | 185 | 186 | 187 | " 188 | 189 | 190 | 191 | 192 | ) 193 | ) 194 | ) 195 | 196 | 197 | 198 | 199 | } else if (theme == "rstudio") { 200 | htmltools::tagList( 201 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 202 | 203 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 204 | 205 | htmltools::tags$script( 206 | htmltools::HTML( 207 | " 208 | 209 | bubbly({ 210 | animate: true, // default is true 211 | blur: 1, // default is 4 212 | bubbleFunc: () => `hsla(#75AADB, 100%, 50%, 1)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 213 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 214 | canvas: document.querySelector('#background'), // default is created and attached 215 | colorStart: '#ECF3F9', // default is blue-ish 216 | colorStop: '#75AADB',// default is blue-ish 217 | compose: 'lighter', // default is 'lighter' 218 | shadowColor: '#0ff', // default is #fff 219 | angleFunc: () => Math.random() * Math.PI * 2, // default is this 220 | velocityFunc: () => 0.5 + Math.random() * 0.5, // default is this 221 | radiusFunc: () => 8 + Math.random() * 25 // default is 4 + Math.random() * width / 25 222 | }); 223 | 224 | 225 | 226 | " 227 | 228 | 229 | 230 | 231 | ) 232 | ) 233 | 234 | 235 | ) 236 | 237 | 238 | 239 | 240 | 241 | } else if (theme == "ash") { 242 | htmltools::tagList( 243 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 244 | 245 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 246 | 247 | htmltools::tags$script( 248 | htmltools::HTML( 249 | " 250 | 251 | bubbly({ 252 | animate: true, // default is true 253 | blur: 2, // default is 4 254 | bubbleFunc: () => `hsla(30, 100%, 50%, ${Math.random() * 0.25})`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 255 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 256 | canvas: document.querySelector('#background'), // default is created and attached 257 | colorStart: '#FFFFFF', // default is blue-ish 258 | colorStop: '#272822',// default is blue-ish 259 | compose: 'lighter', // default is 'lighter' 260 | shadowColor: '#FFFFFF', // default is #fff 261 | angleFunc: () => Math.random() * Math.PI * 2, // default is this 262 | velocityFunc: () => 1 + Math.random() * 0.5, // default is this 263 | radiusFunc: () => 20 + Math.random() * 25 // default is 4 + Math.random() * width / 25 264 | }); 265 | 266 | 267 | 268 | " 269 | 270 | 271 | 272 | 273 | ) 274 | ) 275 | 276 | 277 | ) 278 | 279 | 280 | 281 | } else if (theme == "classy") { 282 | htmltools::tagList( 283 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 284 | 285 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 286 | 287 | htmltools::tags$script( 288 | htmltools::HTML( 289 | " 290 | 291 | bubbly({ 292 | animate: true, // default is true 293 | blur: 1, // default is 4 294 | bubbleFunc: () => `hsla(100, 100%, 50%, 1})`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 295 | bubbles: 40, // default is Math.floor((canvas.width + canvas.height) * 0.02); 296 | canvas: document.querySelector('#background'), // default is created and attached 297 | colorStart: '#272822', // default is blue-ish 298 | colorStop: '#4E5C68',// default is blue-ish 299 | compose: 'lighter', // default is 'lighter' 300 | shadowColor: '#22A5F1', // default is #fff 301 | angleFunc: () => Math.random() * Math.PI * 4, // default is this 302 | velocityFunc: () => 1 + Math.random() * 0.5, // default is this 303 | radiusFunc: () => 1 + Math.random() * 25 // default is 4 + Math.random() * width / 25 304 | }); 305 | 306 | 307 | 308 | " 309 | 310 | 311 | 312 | 313 | ) 314 | ) 315 | 316 | 317 | ) 318 | 319 | 320 | 321 | 322 | 323 | 324 | } else if (theme == "volcano") { 325 | htmltools::tagList( 326 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 327 | 328 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 329 | 330 | 331 | htmltools::tags$script( 332 | htmltools::HTML( 333 | " 334 | 335 | bubbly({ 336 | animate: true, // default is true 337 | blur: 1, // default is 4 338 | bubbleFunc: () => `hsla(250, 20%, 80%, 1})`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 339 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 340 | canvas: document.querySelector('#background'), // default is created and attached 341 | colorStart: '#d10000', // default is blue-ish 342 | colorStop: '#dbd534',// default is blue-ish 343 | compose: 'lighter', // default is 'lighter' 344 | shadowColor: '#FFE300', // default is #fff 345 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 346 | velocityFunc: () => 1 + Math.random() * 0.5, // default is this 347 | radiusFunc: () => 1 + Math.random() * 25 // default is 4 + Math.random() * width / 25 348 | }); 349 | 350 | 351 | 352 | " 353 | 354 | 355 | 356 | 357 | ) 358 | ) 359 | 360 | 361 | ) 362 | 363 | 364 | 365 | 366 | 367 | } else if (theme == "lacoste") { 368 | htmltools::tagList( 369 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 370 | 371 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 372 | 373 | 374 | htmltools::tags$script( 375 | htmltools::HTML( 376 | " 377 | 378 | bubbly({ 379 | animate: true, // default is true 380 | blur: 1, // default is 4 381 | bubbleFunc: () => `hsla(0, 60%, 80%, 1})`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 382 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 383 | canvas: document.querySelector('#background'), // default is created and attached 384 | colorStart: '#064543', // default is blue-ish 385 | colorStop: '#097355',// default is blue-ish 386 | compose: 'lighter', // default is 'lighter' 387 | shadowColor: '#FF59C3', // default is #fff 388 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 389 | velocityFunc: () => 1 + Math.random() * 0.5, // default is this 390 | radiusFunc: () => 4 + Math.random() * 25 // default is 4 + Math.random() * width / 25 391 | }); 392 | 393 | 394 | 395 | " 396 | 397 | 398 | 399 | 400 | ) 401 | ) 402 | 403 | 404 | ) 405 | } else if (theme == "warmup") { 406 | htmltools::tagList( 407 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 408 | 409 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 410 | 411 | 412 | htmltools::tags$script( 413 | htmltools::HTML( 414 | " 415 | 416 | bubbly({ 417 | animate: true, // default is true 418 | blur: 1, // default is 4 419 | bubbleFunc: () => `hsla(${Math.random() * 360}, 100%, 50%, 0.5)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 420 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 421 | canvas: document.querySelector('#background'), // default is created and attached 422 | colorStart: '#d4671e', // default is blue-ish 423 | colorStop: '#f27474',// default is blue-ish 424 | compose: 'lighter', // default is 'lighter' 425 | shadowColor: '#FF59C3', // default is #fff 426 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 427 | velocityFunc: () => 0.5 + Math.random() * 0.5, // default is this 428 | radiusFunc: () => 1 + Math.random() * 25 // default is 4 + Math.random() * width / 25 429 | }); 430 | 431 | 432 | 433 | " 434 | 435 | 436 | 437 | 438 | ) 439 | ) 440 | 441 | 442 | ) 443 | 444 | 445 | 446 | } else if (theme == "fire") { 447 | htmltools::tagList( 448 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 449 | 450 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 451 | 452 | htmltools::tags$script( 453 | htmltools::HTML( 454 | " 455 | 456 | bubbly({ 457 | animate: true, // default is true 458 | blur: 1, // default is 4 459 | bubbleFunc: () => `hsla(${Math.random() * 1.232}, 100%, 50%, 0.5)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 460 | bubbles: 300, // default is Math.floor((canvas.width + canvas.height) * 0.02); 461 | canvas: document.querySelector('#background'), // default is created and attached 462 | colorStart: '#f27f59', // default is blue-ish 463 | colorStop: '#f27f59',// default is blue-ish 464 | compose: 'lighter', // default is 'lighter' 465 | shadowColor: '#f27f59', // default is #fff 466 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 467 | velocityFunc: () => 0.5 + Math.random() * 0.5, // default is this 468 | radiusFunc: () => 19 + Math.random() * 25 // default is 4 + Math.random() * width / 25 469 | }); 470 | 471 | 472 | 473 | " 474 | 475 | 476 | 477 | 478 | ) 479 | ) 480 | 481 | 482 | ) 483 | } else if (theme == "traffic") { 484 | htmltools::tagList( 485 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 486 | 487 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 488 | 489 | htmltools::tags$script( 490 | htmltools::HTML( 491 | " 492 | 493 | bubbly({ 494 | animate: true, // default is true 495 | blur: 1, // default is 4 496 | bubbleFunc: () => `hsla(${Math.random() * 1.232}, 100%, 50%, 0.5)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 497 | bubbles: 100, // default is Math.floor((canvas.width + canvas.height) * 0.02); 498 | canvas: document.querySelector('#background'), // default is created and attached 499 | colorStart: '#D79D73', // default is blue-ish 500 | colorStop: '#514145',// default is blue-ish 501 | compose: 'lighter', // default is 'lighter' 502 | shadowColor: '#9E6A4D', // default is #fff 503 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 504 | velocityFunc: () => 2 + Math.random() * 0.5, // default is this 505 | radiusFunc: () => 12 + Math.random() * 10 // default is 4 + Math.random() * width / 25 506 | }); 507 | 508 | 509 | 510 | " 511 | 512 | 513 | 514 | 515 | ) 516 | ) 517 | 518 | 519 | ) 520 | 521 | 522 | 523 | 524 | } else if (theme == "life") { 525 | htmltools::tagList( 526 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 527 | 528 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 529 | 530 | 531 | htmltools::tags$script( 532 | htmltools::HTML( 533 | " 534 | bubbly({ 535 | colorStart: '#a4cc2b', 536 | colorStop: '#CAB9C4', 537 | bubbles:299, 538 | blur:1, 539 | compose: 'source-over', 540 | bubbleFunc:() => `hsla(${200 + Math.random() * 10}, 100%, 50%, 1)`, 541 | angleFunc:() => Math.random() > 0.5 ? Math.PI : 2 * Math.PI, 542 | velocityFunc:() => 2 + Math.random() * 1, 543 | radiusFunc:() => Math.random() * 7 544 | }); 545 | 546 | 547 | " 548 | 549 | 550 | 551 | 552 | ) 553 | ) 554 | 555 | 556 | ) 557 | 558 | 559 | 560 | } else if (theme == "darksky") { 561 | htmltools::tagList( 562 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 563 | 564 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 565 | 566 | 567 | htmltools::tags$script( 568 | htmltools::HTML( 569 | " 570 | bubbly({ 571 | colorStart: '#272822', 572 | colorStop: '#272822', 573 | bubbles:299, 574 | blur:1, 575 | compose: 'source-over', 576 | bubbleFunc:() => `hsla(${200 + Math.random() * 10}, 100%, 50%, 1)`, 577 | angleFunc:() => Math.random() > 0.5 ? Math.PI : 2 * Math.PI, 578 | velocityFunc:() => 2 + Math.random() * 1, 579 | radiusFunc:() => Math.random() * 50 580 | }); 581 | 582 | 583 | " 584 | 585 | 586 | 587 | 588 | ) 589 | ) 590 | 591 | 592 | ) 593 | 594 | 595 | 596 | } else if (theme == "orangina") { 597 | htmltools::tagList( 598 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 599 | 600 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 601 | 602 | 603 | htmltools::tags$script( 604 | htmltools::HTML( 605 | " 606 | bubbly({ 607 | colorStart: '#4E5C68', 608 | colorStop: '#4E5C68', 609 | bubbles:299, 610 | blur:1, 611 | compose: 'source-over', 612 | bubbleFunc:() => `hsla(${400 + Math.random() * 10}, 100%, 50%, 1)`, 613 | angleFunc:() => Math.random() > 0.5 ? Math.PI : 2 * Math.PI, 614 | velocityFunc:() => 2 + Math.random() * 1, 615 | radiusFunc:() => Math.random() * 50 616 | }); 617 | 618 | 619 | " 620 | 621 | 622 | 623 | 624 | ) 625 | ) 626 | 627 | 628 | ) 629 | 630 | 631 | } else if (theme == "meteor") { 632 | htmltools::tagList( 633 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 634 | 635 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 636 | 637 | 638 | htmltools::tags$script( 639 | htmltools::HTML( 640 | " 641 | bubbly({ 642 | colorStart: '#4E5C68', 643 | colorStop: '#C54949', 644 | bubbles:299, 645 | blur:1, 646 | compose: 'source-over', 647 | bubbleFunc:() => `hsla(${400 + Math.random() * 10}, 100%, 50%, 1)`, 648 | angleFunc:() => Math.random() > 1 ? Math.PI : 3 * Math.PI, 649 | velocityFunc:() => 4 + Math.random() * 1, 650 | radiusFunc:() => Math.random() * 20 651 | }); 652 | 653 | 654 | " 655 | 656 | 657 | 658 | 659 | ) 660 | ) 661 | 662 | 663 | ) 664 | 665 | 666 | 667 | 668 | 669 | } else if (theme == "gravitas") { 670 | htmltools::tagList( 671 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 672 | 673 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 674 | 675 | 676 | htmltools::tags$script( 677 | htmltools::HTML( 678 | " 679 | bubbly({ 680 | colorStart: '#F92672', 681 | colorStop: '#59B6C7', 682 | bubbles:222, 683 | blur:1, 684 | compose: 'source-over', 685 | bubbleFunc:() => `hsla(${222 + Math.random() * 2}, 100%, 50%, 1)`, 686 | angleFunc:() => Math.random() > 0.3 ? Math.PI : 1.2 * Math.PI, 687 | velocityFunc:() => 2 + Math.random() * 1, 688 | radiusFunc:() => Math.random() * 10 689 | }); 690 | 691 | 692 | " 693 | 694 | 695 | 696 | 697 | ) 698 | ) 699 | 700 | 701 | ) 702 | 703 | 704 | 705 | 706 | } else if (theme == "rladies") { 707 | htmltools::tagList( 708 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 709 | 710 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 711 | 712 | 713 | htmltools::tags$script( 714 | htmltools::HTML( 715 | " 716 | 717 | 718 | bubbly({ 719 | animate: true, // default is true 720 | blur: 1, // default is 4 721 | bubbleFunc: () => `hsla(${Math.random() * 1.232}, 100%, 50%, 0.5)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 722 | bubbles: 10, // default is Math.floor((canvas.width + canvas.height) * 0.02); 723 | canvas: document.querySelector('#background'), // default is created and attached 724 | colorStart: '#4AA2B9', // default is blue-ish 725 | colorStop: '#4AA2B9',// default is blue-ish 726 | compose: 'lighter', // default is 'lighter' 727 | shadowColor: '#901A10', // default is #fff 728 | angleFunc: () => Math.random() * Math.PI * 8, // default is this 729 | velocityFunc: () => 2 + Math.random() * 0.5, // default is this 730 | radiusFunc: () => 100 + Math.random() * 10 // default is 4 + Math.random() * width / 25 731 | }); 732 | 733 | " 734 | 735 | 736 | 737 | 738 | ) 739 | ) 740 | 741 | 742 | ) 743 | 744 | 745 | 746 | } else if (theme == "sunshine") { 747 | htmltools::tagList( 748 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 749 | 750 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 751 | 752 | 753 | htmltools::tags$script( 754 | htmltools::HTML( 755 | " 756 | 757 | 758 | bubbly({ 759 | animate: true, // default is true 760 | blur: 1, // default is 4 761 | bubbleFunc: () => `hsla(${Math.random() * 200.232}, 100%, 50%, 1)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 762 | bubbles: 30, // default is Math.floor((canvas.width + canvas.height) * 0.02); 763 | canvas: document.querySelector('#background'), // default is created and attached 764 | colorStart: '#FF9800', // default is blue-ish 765 | colorStop: '#1B1B1B',// default is blue-ish 766 | compose: 'lighter', // default is 'lighter' 767 | shadowColor: '#4E5C68', // default is #fff 768 | angleFunc: () => Math.random() * Math.PI * 2, // default is this 769 | velocityFunc: () => 2 + Math.random() * 0.5, // default is this 770 | radiusFunc: () => 20 + Math.random() * 5.5 // default is 4 + Math.random() * width / 25 771 | }); 772 | 773 | " 774 | 775 | 776 | ) 777 | ) 778 | 779 | 780 | ) 781 | } else if (theme == "sweet") { 782 | htmltools::tagList( 783 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 784 | 785 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 786 | 787 | 788 | htmltools::tags$script( 789 | htmltools::HTML( 790 | " 791 | 792 | 793 | bubbly({ 794 | animate: true, // default is true 795 | blur: 1, // default is 4 796 | bubbleFunc: () => `hsla(${Math.random() * 200.232}, 100%, 50%, 1)`, // default is () => `hsla(0, 0%, 100%, ${r() * 0.1})`) 797 | bubbles: 20, // default is Math.floor((canvas.width + canvas.height) * 0.02); 798 | canvas: document.querySelector('#background'), // default is created and attached 799 | colorStart: '#e63946', // default is blue-ish 800 | colorStop: '#8d99ae',// default is blue-ish 801 | compose: 'lighter', // default is 'lighter' 802 | shadowColor: '#4E5C68', // default is #fff 803 | angleFunc: () => Math.random() * Math.PI * 2, // default is this 804 | velocityFunc: () => 2 + Math.random() * 0.5, // default is this 805 | radiusFunc: () => 20 + Math.random() * 5.5 // default is 4 + Math.random() * width / 25 806 | }); 807 | 808 | " 809 | 810 | 811 | 812 | 813 | ) 814 | ) 815 | 816 | 817 | ) 818 | 819 | 820 | 821 | 822 | 823 | } else if (theme == "lalaland"){ 824 | 825 | htmltools::tagList( 826 | 827 | htmltools::tags$script(src = "https://cdn.jsdelivr.net/npm/bubbly-bg@1.0.0/dist/bubbly-bg.js"), 828 | 829 | htmltools::tags$style(htmltools::HTML(glue::glue("body{{color:{color}}}"))), 830 | 831 | 832 | htmltools::tags$script( 833 | htmltools::HTML( 834 | " 835 | bubbly({ 836 | colorStart: '#0A0C12', 837 | colorStop: '#0B0E15', 838 | bubbles:100, 839 | blur:0, 840 | compose: 'source-over', 841 | bubbleFunc:() => `hsla(${0 + Math.random() * 10}, 100%, 100%, 1)`, 842 | velocityFunc:() => 0.05 + Math.random() * 0.05, 843 | radiusFunc:() => Math.random() * 1.2 844 | }); 845 | 846 | 847 | " 848 | 849 | 850 | 851 | 852 | ) 853 | ) 854 | 855 | 856 | ) 857 | 858 | 859 | } 860 | 861 | 862 | 863 | 864 | 865 | 866 | 867 | 868 | 869 | 870 | 871 | 872 | 873 | 874 | 875 | 876 | 877 | 878 | 879 | } 880 | -------------------------------------------------------------------------------- /README.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | output: github_document 3 | --- 4 | 5 | 6 | 7 | ```{r, include = FALSE} 8 | knitr::opts_chunk$set( 9 | collapse = TRUE, 10 | comment = "#>", 11 | fig.path = "man/figures/README-", 12 | out.width = "100%" 13 | ) 14 | ``` 15 | 16 | # bubblyr 17 | 18 | 19 | [![CRAN_Status_Badge](https://www.r-pkg.org/badges/version/bubblyr)](https://cran.r-project.org/package=bubblyr) 20 | 21 | [![CRAN_time_from_release](https://www.r-pkg.org/badges/ago/bubblyr)](https://cran.r-project.org/package=bubblyr) 22 | 23 | [![metacran 24 | downloads](https://cranlogs.r-pkg.org/badges/bubblyr)](https://cran.r-project.org/package=bubblyr) 25 | 26 | ![](http://cranlogs.r-pkg.org/badges/grand-total/bubblyr?color=blue) 27 | 28 | [![license](https://img.shields.io/github/license/mashape/apistatus.svg)](https://choosealicense.com/licenses/mit/) 29 | 30 | [![R build status](https://github.com/feddelegrand7/bubblyr/workflows/R-CMD-check/badge.svg)](https://github.com/feddelegrand7/bubblyr/actions) 31 | 32 | 33 | `bubblyr` is an R wrapper of the JavaScript library [bubbly-bg](https://github.com/tipsy/bubbly-bg). It allows you to add beautiful animated bubbles within Shiny and RMarkdown backgrounds. You can choose from several themes and apply the animation with one line of code. 34 | 35 | 36 |
37 | 38 | ![](man/figures/lalalandexample.gif) 39 | 40 | 41 | ## Installation 42 | 43 | You can install the `bubblyr` package from CRAN with: 44 | 45 | ```{r, eval=FALSE} 46 | 47 | install.packages("bubblyr") 48 | 49 | ``` 50 | 51 | 52 | You can install the development version of `bubblyr` from Github with: 53 | 54 | ```{r, eval=FALSE} 55 | 56 | install.packages("remotes") #if not installed 57 | 58 | remotes::install_github("feddelegrand7/bubblyr") 59 | 60 | ``` 61 | 62 | 63 | # Themes 64 | 65 | Here a list of all the available themes. Note that The ocean, cherry, hippie, bigmom and deepsea themes are provided by the author of the bubbly-bg JavaScript library, I just gave them some fancy names: 66 | 67 | ```{r, echo=FALSE} 68 | list <- c( 69 | "ocean", 70 | "cherry", 71 | "hippie", 72 | "bigmom", 73 | "deepsea", 74 | "illusion", 75 | "rstudio", 76 | "ash", 77 | "classy", 78 | "volcano", 79 | "lacoste", 80 | "warmup", 81 | "fire", 82 | "traffic", 83 | "life", 84 | "darksky", 85 | "orangina", 86 | "meteor", 87 | "gravitas", 88 | "rladies", 89 | "sunshine", 90 | "sweet", 91 | "lalaland" 92 | ) 93 | 94 | knitr::kable(list, col.names = "Themes") 95 | ``` 96 | 97 | Below you can find some examples, feel free to experiment the remaining themes: 98 | 99 | #### Important: You may experiment some lags when viewing your Shiny/Rmd Document in the RStudio pane, instead use the browser. 100 | 101 | 102 | ```{r, eval=FALSE} 103 | library(shiny) 104 | library(bubblyr) 105 | 106 | ui <- fluidPage( 107 | 108 | bubbly(theme = "bigmom") 109 | 110 | ) 111 | 112 | server <- function(input, output) {} 113 | 114 | shinyApp(ui = ui, server = server) 115 | 116 | ``` 117 | 118 | ![](man/figures/bigmom.gif) 119 | 120 | 121 | ```{r, eval=FALSE} 122 | library(shiny) 123 | library(bubblyr) 124 | 125 | ui <- fluidPage( 126 | 127 | bubbly(theme = "rstudio") 128 | 129 | ) 130 | 131 | server <- function(input, output) {} 132 | 133 | shinyApp(ui = ui, server = server) 134 | 135 | ``` 136 | 137 | 138 | ![](man/figures/rstudio.gif) 139 | 140 | ```{r, eval=FALSE} 141 | library(shiny) 142 | library(bubblyr) 143 | 144 | ui <- fluidPage( 145 | 146 | bubbly(theme = "classy") 147 | 148 | ) 149 | 150 | server <- function(input, output) {} 151 | 152 | shinyApp(ui = ui, server = server) 153 | 154 | ``` 155 | 156 | 157 | ![](man/figures/classy.gif) 158 | 159 | 160 | ## Code of Conduct 161 | 162 | Please note that the bubblyr project is released with a [Contributor Code of Conduct](https://contributor-covenant.org/version/2/0/CODE_OF_CONDUCT.html). By contributing to this project, you agree to abide by its terms. 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | # bubblyr 5 | 6 | 7 | [![CRAN\_Status\_Badge](https://www.r-pkg.org/badges/version/bubblyr)](https://cran.r-project.org/package=bubblyr) 8 | [![CRAN\_time\_from\_release](https://www.r-pkg.org/badges/ago/bubblyr)](https://cran.r-project.org/package=bubblyr) 9 | [![metacran 10 | downloads](https://cranlogs.r-pkg.org/badges/bubblyr)](https://cran.r-project.org/package=bubblyr) 11 | ![](http://cranlogs.r-pkg.org/badges/grand-total/bubblyr?color=blue) 12 | [![license](https://img.shields.io/github/license/mashape/apistatus.svg)](https://choosealicense.com/licenses/mit/) 13 | [![R build 14 | status](https://github.com/feddelegrand7/bubblyr/workflows/R-CMD-check/badge.svg)](https://github.com/feddelegrand7/bubblyr/actions) 15 | 16 | 17 | `bubblyr` is an R wrapper of the JavaScript library 18 | [bubbly-bg](https://github.com/tipsy/bubbly-bg). It allows you to add 19 | beautiful animated bubbles within Shiny and RMarkdown backgrounds. You 20 | can choose from several themes and apply the animation with one line of 21 | code. 22 | 23 |
24 | 25 | ![](man/figures/lalalandexample.gif) 26 | 27 | ## Installation 28 | 29 | You can install the `bubblyr` package from CRAN with: 30 | 31 | ``` r 32 | install.packages("bubblyr") 33 | ``` 34 | 35 | You can install the development version of `bubblyr` from Github with: 36 | 37 | ``` r 38 | install.packages("remotes") #if not installed 39 | 40 | remotes::install_github("feddelegrand7/bubblyr") 41 | ``` 42 | 43 | # Themes 44 | 45 | Here a list of all the available themes. Note that The ocean, cherry, 46 | hippie, bigmom and deepsea themes are provided by the author of the 47 | bubbly-bg JavaScript library, I just gave them some fancy names: 48 | 49 | | Themes | 50 | |:---------| 51 | | ocean | 52 | | cherry | 53 | | hippie | 54 | | bigmom | 55 | | deepsea | 56 | | illusion | 57 | | rstudio | 58 | | ash | 59 | | classy | 60 | | volcano | 61 | | lacoste | 62 | | warmup | 63 | | fire | 64 | | traffic | 65 | | life | 66 | | darksky | 67 | | orangina | 68 | | meteor | 69 | | gravitas | 70 | | rladies | 71 | | sunshine | 72 | | sweet | 73 | | lalaland | 74 | 75 | Below you can find some examples, feel free to experiment the remaining 76 | themes: 77 | 78 | #### Important: You may experiment some lags when viewing your Shiny/Rmd Document in the RStudio pane, instead use the browser. 79 | 80 | ``` r 81 | library(shiny) 82 | library(bubblyr) 83 | 84 | ui <- fluidPage( 85 | 86 | bubbly(theme = "bigmom") 87 | 88 | ) 89 | 90 | server <- function(input, output) {} 91 | 92 | shinyApp(ui = ui, server = server) 93 | ``` 94 | 95 | ![](man/figures/bigmom.gif) 96 | 97 | ``` r 98 | library(shiny) 99 | library(bubblyr) 100 | 101 | ui <- fluidPage( 102 | 103 | bubbly(theme = "rstudio") 104 | 105 | ) 106 | 107 | server <- function(input, output) {} 108 | 109 | shinyApp(ui = ui, server = server) 110 | ``` 111 | 112 | ![](man/figures/rstudio.gif) 113 | 114 | ``` r 115 | library(shiny) 116 | library(bubblyr) 117 | 118 | ui <- fluidPage( 119 | 120 | bubbly(theme = "classy") 121 | 122 | ) 123 | 124 | server <- function(input, output) {} 125 | 126 | shinyApp(ui = ui, server = server) 127 | ``` 128 | 129 | ![](man/figures/classy.gif) 130 | 131 | ## Code of Conduct 132 | 133 | Please note that the bubblyr project is released with a [Contributor 134 | Code of 135 | Conduct](https://contributor-covenant.org/version/2/0/CODE_OF_CONDUCT.html). 136 | By contributing to this project, you agree to abide by its terms. 137 | -------------------------------------------------------------------------------- /bubblyr.Rproj: -------------------------------------------------------------------------------- 1 | Version: 1.0 2 | 3 | RestoreWorkspace: Default 4 | SaveWorkspace: Default 5 | AlwaysSaveHistory: Default 6 | 7 | EnableCodeIndexing: Yes 8 | UseSpacesForTab: Yes 9 | NumSpacesForTab: 2 10 | Encoding: UTF-8 11 | 12 | RnwWeave: Sweave 13 | LaTeX: pdfLaTeX 14 | 15 | AutoAppendNewline: Yes 16 | StripTrailingWhitespace: Yes 17 | 18 | BuildType: Package 19 | PackageUseDevtools: Yes 20 | PackageInstallArgs: --no-multiarch --with-keep.source 21 | -------------------------------------------------------------------------------- /cran-comments.md: -------------------------------------------------------------------------------- 1 | ## Test environments 2 | * local R installation, R 4.0.0 3 | * ubuntu 16.04 (on travis-ci), R 4.0.0 4 | * win-builder (devel) 5 | 6 | 7 | -- R CMD check results ----------------------------- bubblyr 0.1.2 ---- 8 | Duration: 17.7s 9 | 10 | 0 errors √ | 0 warnings √ | 0 notes √ 11 | 12 | 13 | * I've added the 'lalaland' theme 14 | 15 | * I've added the color argument in which the user can specify the text color. 16 | -------------------------------------------------------------------------------- /man/bubbly.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/bubbly.R 3 | \name{bubbly} 4 | \alias{bubbly} 5 | \title{Add beautiful interactive bubbles within Shing and RMarkdown backgrounds} 6 | \usage{ 7 | bubbly(theme = "ocean", color = "white") 8 | } 9 | \arguments{ 10 | \item{theme}{Name of the bubbles theme. See the vignette for a list of themes.} 11 | 12 | \item{color}{Text color. Defaults to 'white'} 13 | } 14 | \value{ 15 | Themed interactive bubbles for Shiny and RMarkdown backgrounds 16 | } 17 | \description{ 18 | Add beautiful interactive bubbles within Shing and RMarkdown backgrounds 19 | } 20 | \examples{ 21 | if (interactive()) { 22 | 23 | ui <- fluidPage( 24 | 25 | bubbly(theme = "meteor") 26 | 27 | ) 28 | 29 | 30 | server <- function(input, output) {} 31 | 32 | 33 | 34 | shinyApp(ui = ui, server = server) 35 | 36 | 37 | 38 | 39 | } 40 | 41 | 42 | } 43 | -------------------------------------------------------------------------------- /man/figures/bigmom.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/feddelegrand7/bubblyr/b1bbae98ced00e8cc0c4a1f2cef360ac731e146c/man/figures/bigmom.gif -------------------------------------------------------------------------------- /man/figures/classy.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/feddelegrand7/bubblyr/b1bbae98ced00e8cc0c4a1f2cef360ac731e146c/man/figures/classy.gif -------------------------------------------------------------------------------- /man/figures/hex.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/feddelegrand7/bubblyr/b1bbae98ced00e8cc0c4a1f2cef360ac731e146c/man/figures/hex.png -------------------------------------------------------------------------------- /man/figures/lalalandexample.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/feddelegrand7/bubblyr/b1bbae98ced00e8cc0c4a1f2cef360ac731e146c/man/figures/lalalandexample.gif -------------------------------------------------------------------------------- /man/figures/rstudio.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/feddelegrand7/bubblyr/b1bbae98ced00e8cc0c4a1f2cef360ac731e146c/man/figures/rstudio.gif -------------------------------------------------------------------------------- /vignettes/.gitignore: -------------------------------------------------------------------------------- 1 | *.html 2 | *.R 3 | -------------------------------------------------------------------------------- /vignettes/Introduction.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Introduction" 3 | output: rmarkdown::html_vignette 4 | vignette: > 5 | %\VignetteIndexEntry{Introduction} 6 | %\VignetteEngine{knitr::rmarkdown} 7 | %\VignetteEncoding{UTF-8} 8 | --- 9 | 10 | 11 | 12 | `bubblyr` is an R wrapper of the JavaScript library [bubbly-bg](https://github.com/tipsy/bubbly-bg). It allows you to add beautiful animated bubbles within Shiny and RMarkdown backgrounds. You can choose from several themes and apply the animation with one line of code. 13 | 14 | 15 | ## Installation 16 | 17 | You can install the `bubblyr` package from CRAN with: 18 | 19 | ```{r, eval=FALSE} 20 | 21 | install.packages("bubblyr") 22 | 23 | ``` 24 | 25 | 26 | You can install the development version of `bubblyr` from Github with: 27 | 28 | ```{r, eval=FALSE} 29 | 30 | install.packages("remotes") #if not installed 31 | 32 | remotes::install_github("feddelegrand7/bubblyr") 33 | 34 | ``` 35 | 36 | 37 | 38 | 39 | # Themes 40 | 41 | Here a list of all the available themes. Note that The ocean, cherry, hippie, bigmom and deepsea themes are provided by the author of the bubbly-bg library, I just gave them some fancy names: 42 | 43 | 44 | ```{r, echo=FALSE} 45 | list <- c( 46 | "ocean", 47 | "cherry", 48 | "hippie", 49 | "bigmom", 50 | "deepsea", 51 | "illusion", 52 | "rstudio", 53 | "ash", 54 | "classy", 55 | "volcano", 56 | "lacoste", 57 | "warmup", 58 | "fire", 59 | "traffic", 60 | "life", 61 | "darksky", 62 | "orangina", 63 | "meteor", 64 | "gravitas", 65 | "rladies", 66 | "sunshine", 67 | "sweet", 68 | "lalaland" 69 | ) 70 | 71 | knitr::kable(list, col.names = "Themes") 72 | ``` 73 | 74 | Below you can find some examples, feel free to experiment the remaining themes: 75 | 76 | #### Important: You may experiment some lags if you view your Shiny app in RStudio, instead experiment the themes in the browser. 77 | 78 | 79 | 80 | 81 | ```{r, eval=FALSE} 82 | library(shiny) 83 | library(bubblyr) 84 | 85 | ui <- fluidPage( 86 | 87 | bubbly(theme = "bigmom") 88 | 89 | ) 90 | 91 | server <- function(input, output) {} 92 | 93 | shinyApp(ui = ui, server = server) 94 | 95 | ``` 96 | 97 | ![](../man/figures/bigmom.gif) 98 | 99 | 100 | ```{r, eval=FALSE} 101 | library(shiny) 102 | library(bubblyr) 103 | 104 | ui <- fluidPage( 105 | 106 | bubbly(theme = "rstudio") 107 | 108 | ) 109 | 110 | server <- function(input, output) {} 111 | 112 | shinyApp(ui = ui, server = server) 113 | 114 | ``` 115 | 116 | 117 | ![](../man/figures/rstudio.gif) 118 | 119 | ```{r, eval=FALSE} 120 | library(shiny) 121 | library(bubblyr) 122 | 123 | ui <- fluidPage( 124 | 125 | bubbly(theme = "classy") 126 | 127 | ) 128 | 129 | server <- function(input, output) {} 130 | 131 | shinyApp(ui = ui, server = server) 132 | 133 | ``` 134 | 135 | 136 | ![](../man/figures/classy.gif) 137 | 138 | 139 | 140 | 141 | ## Code of Conduct 142 | 143 | Please note that the bubblyr project is released with a [Contributor Code of Conduct](https://contributor-covenant.org/version/2/0/CODE_OF_CONDUCT.html). By contributing to this project, you agree to abide by its terms. 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | --------------------------------------------------------------------------------