diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 000000000..f52ad9360 --- /dev/null +++ b/.eslintignore @@ -0,0 +1,3 @@ +assets/js/search.js +assets/js/bioconductor.js +assets/js/bioc_views.js \ No newline at end of file diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 000000000..d89fc3d56 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,14 @@ +{ + "env": { + "browser": true, + "es2021": true, + "es6": true, + "node": true + }, + "extends": "eslint:recommended", + "parserOptions": { + "ecmaVersion": "latest", + "sourceType": "module" + }, + "rules": {} +} diff --git a/.github/workflows/linter.yaml b/.github/workflows/linter.yaml new file mode 100644 index 000000000..748c9f6b1 --- /dev/null +++ b/.github/workflows/linter.yaml @@ -0,0 +1,35 @@ +name: Run Linters +on: + pull_request: + types: [opened, reopened, synchronize] + +jobs: + build: + if: github.event.pull_request.draft == false + name: Run Linters + runs-on: ubuntu-latest + permissions: + contents: read + packages: read + statuses: write + steps: + - name: Checkout Code + uses: actions/checkout@v3 + with: + fetch-depth: 0 + - name: Lint Code Base + uses: super-linter/super-linter/slim@v5 + env: + LINTER_RULES_PATH: / + VALIDATE_ALL_CODEBASE: false + VALIDATE_GITHUB_ACTIONS: false + VALIDATE_MARKDOWN: false + VALIDATE_NATURAL_LANGUAGE: false + VALIDATE_JSCPD: false + VALIDATE_JSON: false + VALIDATE_R: false + VALIDATE_RUBY: false + VALIDATE_JAVASCRIPT_STANDARD: false + JAVASCRIPT_ES_CONFIG_FILE: .eslintrc.json + DEFAULT_BRANCH: redesign2023 + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.github/workflows/pr_close.yaml b/.github/workflows/pr_close.yaml new file mode 100644 index 000000000..865543c2a --- /dev/null +++ b/.github/workflows/pr_close.yaml @@ -0,0 +1,32 @@ +name: PR - Closed +on: + pull_request: + types: [closed] + +jobs: + dev-pr-close-s3: + runs-on: ubuntu-latest + environment: dev + steps: + - name: Empty Website Bucket + run: | + if aws s3api head-bucket --bucket pr-preview-bioconductor-pr${{github.event.number}} 2>/dev/null; then + aws s3 rm s3://pr-preview-bioconductor-pr${{github.event.number}} --recursive + echo "BUCKET_EXISTS=true" >> "$GITHUB_ENV" + else + echo "Bucket does not exist" + echo "BUCKET_EXISTS=false" >> "$GITHUB_ENV" + fi + env: + AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} + AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + AWS_REGION: "us-east-1" + - name: Delete Website Bucket + if: ${{env.BUCKET_EXISTS == 'true'}} + uses: danburtenshaw/s3-website-pr-action@v2.0.1 + with: + bucket-prefix: "pr-preview-bioconductor" + env: + AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} + AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.github/workflows/pr_deploy.yaml b/.github/workflows/pr_deploy.yaml new file mode 100644 index 000000000..7545b2ece --- /dev/null +++ b/.github/workflows/pr_deploy.yaml @@ -0,0 +1,107 @@ +name: Pr - Preview +on: + pull_request: + types: [opened, reopened, synchronize] +jobs: + dev-pr-create-s3: + if: github.event.pull_request.draft == false + + runs-on: ubuntu-latest + environment: dev + steps: + - name: Checkout + uses: actions/checkout@v3 + + - name: Restore Nanoc Cache + id: cache-nanoc-tmp + uses: actions/cache/restore@v3 + with: + path: tmp + key: ${{ runner.os }}-nanoc-tmp + + - name: Restore Site Output Cache + id: cache-site-output + uses: actions/cache/restore@v3 + with: + path: output + key: ${{ runner.os }}-site-output + + - name: Set up ruby + uses: ruby/setup-ruby@ec02537da5712d66d4d50a0f33b7eb52773b5ed1 + with: + ruby-version: "2.6.5" + + - name: Install dependencies + run: bundle install --jobs 4 --retry 3 + + - name: build website + run: rake + + - name: Create Bucket + run: | + if aws s3api head-bucket --bucket pr-preview-bioconductor-pr${{github.event.number}} 2>/dev/null; then + echo "Bucket already exists" + else + aws s3 mb s3://pr-preview-bioconductor-pr${{github.event.number}} + aws s3api delete-public-access-block --bucket pr-preview-bioconductor-pr${{github.event.number}} + aws s3api delete-bucket-ownership-controls --bucket pr-preview-bioconductor-pr${{github.event.number}} + aws s3api put-bucket-website --bucket pr-preview-bioconductor-pr${{github.event.number}} \ + --website-configuration '{"IndexDocument":{"Suffix":"index.html"},"ErrorDocument":{"Key":"404.html"}}' + fi + env: + AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} + AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + AWS_REGION: "us-east-1" + - name: Deploy S3 Website + uses: danburtenshaw/s3-website-pr-action@v2.0.1 + with: + bucket-prefix: "pr-preview-bioconductor" + folder-to-copy: "./output" + env: + AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} + AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + kpi_metrics: + needs: dev-pr-create-s3 + permissions: + pull-requests: write + name: All KPI metrics + runs-on: ubuntu-latest + steps: + - name: checkout + uses: actions/checkout@v3 + - name: Setup Node.js environment + uses: actions/setup-node@v3.7.0 + with: + node-version: 18 + - name: install psi and axe + run: | + npm install psi + npm install @axe-core/cli + - name: run desktop psi + run: | + echo "DESKTOP_PSI_RESULTS<> $GITHUB_ENV + echo "$(node PageSpeed.js url=http://pr-preview-bioconductor-pr${{github.event.number}}.s3-website-us-east-1.amazonaws.com,strategy=desktop,threshold=50,apiKey=none)" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: run mobile psi + run: | + echo "MOBILE_PSI_RESULTS<> $GITHUB_ENV + echo "$(node PageSpeed.js url=http://pr-preview-bioconductor-pr${{github.event.number}}.s3-website-us-east-1.amazonaws.com,strategy=mobile,threshold=50,apiKey=none)" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: add_comment_pageSpeed + uses: mshick/add-pr-comment@v2 + with: + message: | + ${{env.DESKTOP_PSI_RESULTS}} + ${{env.MOBILE_PSI_RESULTS}} + message-id: psi + - name: run axe accesibility test + run: | + echo "AXE_RESULTS<> $GITHUB_ENV + echo "$(npx axe http://pr-preview-bioconductor-pr${{github.event.number}}.s3-website-us-east-1.amazonaws.com)" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: add_comment_axe + uses: mshick/add-pr-comment@v2 + with: + message: ${{env.AXE_RESULTS}} + message-id: axe diff --git a/.github/workflows/staging.yaml b/.github/workflows/staging.yaml new file mode 100644 index 000000000..7ea40225b --- /dev/null +++ b/.github/workflows/staging.yaml @@ -0,0 +1,99 @@ +name: Deploy To staging + +on: + push: + branches: + - redesign2023 +jobs: + staging-deploy: + concurrency: ci-${{ github.ref }} + runs-on: ubuntu-latest + environment: staging + + steps: + - name: checkout + uses: actions/checkout@v3 + + - name: Use Nanoc Cache + id: cache-nanoc-tmp + uses: actions/cache@v3 + with: + path: tmp + key: ${{ runner.os }}-nanoc-tmp + + - name: Use Site Output Cache + id: cache-site-output + uses: actions/cache@v3 + with: + path: output + key: ${{ runner.os }}-site-output + + - name: Set up ruby + uses: ruby/setup-ruby@ec02537da5712d66d4d50a0f33b7eb52773b5ed1 + with: + ruby-version: "2.6.5" + + - name: Install dependencies + run: bundle install --jobs 4 --retry 3 + + - name: Build website + run: rake + + - name: Deploy website to staging s3 + uses: Reggionick/s3-deploy@v4.0.0 + with: + folder: output + bucket: ${{secrets.S3_BUCKET}} + bucket-region: us-east-1 + delete-removed: true + env: + AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} + AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + kpi_metrics: + needs: staging-deploy + permissions: + pull-requests: write + name: All KPI metrics + runs-on: ubuntu-latest + steps: + - name: checkout + uses: actions/checkout@v3 + - name: Setup Node.js environment + uses: actions/setup-node@v3.7.0 + with: + node-version: 18 + - name: install psi and axe + run: | + npm install psi + npm install @axe-core/cli + - name: run desktop psi + run: | + echo "DESKTOP_PSI_RESULTS<> $GITHUB_ENV + echo "$(node PageSpeed.js url=${{vars.STAGING_URL}},strategy=desktop,threshold=50,apiKey=none)" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: run mobile psi + run: | + echo "MOBILE_PSI_RESULTS<> $GITHUB_ENV + echo "$(node PageSpeed.js url=${{vars.STAGING_URL}},strategy=mobile,threshold=50,apiKey=none)" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: run axe accesibility test + run: | + echo "AXE_RESULTS<> $GITHUB_ENV + echo "$(npx axe ${{vars.STAGING_URL}})" >> $GITHUB_ENV + echo "EOF" >> $GITHUB_ENV + - name: send notification psi + if: ${{ github.ref == 'refs/heads/redesign2023' }} + uses: 8398a7/action-slack@v2 + with: + status: ${{ job.status }} + text: "${{env.DESKTOP_PSI_RESULTS}} \n ${{env.MOBILE_PSI_RESULTS}}" + env: + SLACK_WEBHOOK_URL: ${{secrets.SLACK_WEBHOOK}} + - name: send notification axe + if: ${{ github.ref == 'refs/heads/redesign2023' }} + uses: 8398a7/action-slack@v2 + with: + status: ${{ job.status }} + text: "${{env.AXE_RESULTS}}" + env: + SLACK_WEBHOOK_URL: ${{secrets.SLACK_WEBHOOK}} diff --git a/.gitignore b/.gitignore index b3baf8649..6777aa776 100644 --- a/.gitignore +++ b/.gitignore @@ -23,4 +23,6 @@ assets/help/workflows/* workflows_tmp/ content/help/workflows/* postgresql_password -manifest/* \ No newline at end of file +manifest/* +node_modules/ +package diff --git a/.htmlhintrc b/.htmlhintrc new file mode 100644 index 000000000..3c5c80fa7 --- /dev/null +++ b/.htmlhintrc @@ -0,0 +1,21 @@ +{ + "doctype-first": false, + "spec-char-escape": false, + "head-script-disabled": true, + "style-disabled": true, + "attr-lowercase": true, + "attr-no-duplications": true, + "attr-no-unnecessary-whitespace": true, + "attr-value-single-quotes": false, + "attr-value-double-quotes": true, + "attr-whitespace": true, + "alt-require": true, + "input-requires-lable": true, + "tag-pair": false, + "tagname-lowercase": true, + "tagname-specialchars": true, + "src-not-empty": true, + "id-class-value": "dash", + "inline-script-disabled": true, + "inline-style-disabled": true +} diff --git a/.stylelintrc.json b/.stylelintrc.json new file mode 100644 index 000000000..0a08a1578 --- /dev/null +++ b/.stylelintrc.json @@ -0,0 +1,3 @@ +{ + "extends": ["stylelint-config-standard"] +} diff --git a/Dockerfile b/Dockerfile index 570977fd3..2028a06b7 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,31 +1,34 @@ FROM ruby:2.6.5 ## System dependencies - -RUN apt-get update && apt install -y \ - rsync \ - && apt-get clean \ - && rm -rf /var/lib/apt/lists/* +RUN apt-get update && apt-get install -y \ + rsync \ + && apt-get clean \ + && rm -rf /var/lib/apt/lists/* ## Install gems +COPY Gemfile /opt +COPY Gemfile.lock /opt + +## Set the working directory to /opt/bioconductor.org +WORKDIR /opt/bioconductor.org + +## Copy the remaining files from bioconductor.org/ to /opt/bioconductor.org +COPY . . -COPY Gemfile /tmp -COPY Gemfile.lock /tmp -WORKDIR /tmp -## RUN bundle lock +## Install bundle and dependencies +RUN gem install bundler RUN bundle install --jobs=4 && bundle clean --force ## Set up web server - EXPOSE 3000 ## Create startup script - -RUN echo '#! /bin/bash \n\ - cd /bioconductor.org \n\ - rake \n\ - cd output \n\ - adsf\n' > .startup.sh \\ +RUN echo '#! /bin/bash' > .startup.sh \ + && echo 'cd /opt/bioconductor.org' >> .startup.sh \ + && echo 'rake' >> .startup.sh \ + && echo 'cd output' >> .startup.sh \ + && echo 'adsf' >> .startup.sh \ && chmod +x .startup.sh -CMD ["./.startup.sh"] +CMD ["/opt/bioconductor.org/.startup.sh"] diff --git a/Gemfile b/Gemfile index bd2799319..2bf219f0f 100644 --- a/Gemfile +++ b/Gemfile @@ -1,6 +1,6 @@ raise 'Ruby version must be 2.3 or greater' unless RUBY_VERSION.to_f >= 2.3 source 'http://rubygems.org' -gem "nanoc", "~> 4.0" +gem "nanoc", "~> 4.9.5" gem "pry" gem "pry-byebug" gem "rdiscount" diff --git a/Gemfile.lock b/Gemfile.lock index e627456c6..1a646f9d9 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -8,15 +8,13 @@ GEM buftok (0.2.0) byebug (10.0.0) coderay (1.1.2) - colored (1.2) - concurrent-ruby (1.0.5) - cri (2.10.1) - colored (~> 1.2) + concurrent-ruby (1.2.2) + cri (2.15.11) ddmemoize (1.0.0) ddmetrics (~> 1.0) ref (~> 2.0) - ddmetrics (1.0.0) - ddplugin (1.0.1) + ddmetrics (1.0.1) + ddplugin (1.0.3) descriptive_statistics (2.5.1) domain_name (0.5.20170404) unf (>= 0.0.5, < 1.0.0) @@ -43,6 +41,7 @@ GEM httparty (0.16.0) multi_xml (>= 0.5.2) json (2.1.0) + json_schema (0.21.0) kramdown (2.1.0) kramdown-parser-gfm (1.1.0) kramdown (~> 2.0) @@ -67,16 +66,18 @@ GEM mini_portile2 (2.4.0) multi_xml (0.6.0) multipart-post (2.0.0) - nanoc (4.9.0) + nanoc (4.9.9) addressable (~> 2.5) - cri (~> 2.8) + cri (~> 2.15) ddmemoize (~> 1.0) ddmetrics (~> 1.0) ddplugin (~> 1.0) hamster (~> 3.0) + json_schema (~> 0.19) parallel (~> 1.12) ref (~> 2.0) slow_enumerator_tools (~> 1.0) + tomlrb (~> 1.2) naught (1.1.0) net-http-digest_auth (1.4.1) net-http-persistent (2.9.4) @@ -86,7 +87,7 @@ GEM octokit (4.16.0) faraday (>= 0.9) sawyer (~> 0.8.0, >= 0.5.3) - parallel (1.12.1) + parallel (1.23.0) pg (1.0.0) polyglot (0.3.5) pry (0.11.3) @@ -126,6 +127,7 @@ GEM temple (0.8.0) thread_safe (0.3.6) tilt (2.0.8) + tomlrb (1.3.0) treetop (1.6.9) polyglot (~> 0.3) treetop-dcf (0.2.1) @@ -163,7 +165,7 @@ DEPENDENCIES kramdown-parser-gfm mechanize mime-types - nanoc (~> 4.0) + nanoc (~> 4.9.5) nokogiri octokit pg diff --git a/PageSpeed.js b/PageSpeed.js new file mode 100644 index 000000000..62f44cfd8 --- /dev/null +++ b/PageSpeed.js @@ -0,0 +1,79 @@ +const psi = require("psi"); +const process = require("process"); +const parseInputs = (inputs) => { + const keyValuePairs = inputs.split(","); + + let url, strategy, threshold, apiKey; + + keyValuePairs.forEach((pair) => { + const [key, value] = pair.split("="); + switch (key) { + case "url": + url = value; + break; + case "strategy": + strategy = value; + break; + case "threshold": + threshold = value; + break; + case "apiKey": + apiKey = value; + break; + default: + throw new Error( + "Invalid input format, please use the following: url=,strategy=,threshold=,apiKey= strategy=,threshold=,apiKey= 100) { + throw new Error( + 'Invalid threshold. Enter a number between 0 and 100 or "none".' + ); + } + } + + return { + url, + strategy, + threshold: threshold === "none" ? 70 : Number(threshold), + key: apiKey === "none" ? undefined : apiKey, + }; +}; + +const runPageSpeed = async (inputs) => { + const { url, strategy, threshold, key } = { ...inputs }; + try { + console.log(`Page Speed results for ${url} using ${strategy}`); + await psi.output(url, { + ...(key ? { key } : undefined), + ...(key ? undefined : { nokey: "true" }), + strategy, + format: "cli", + threshold, + }); + } catch (e) { + throw e.message; + } +}; + +let parsedInputs; +try { + parsedInputs = parseInputs(process.argv[2]); +} catch (e) { + throw e.message; +} + +runPageSpeed(parsedInputs); diff --git a/README.md b/README.md index 951c4307a..f7fe9a6ba 100644 --- a/README.md +++ b/README.md @@ -19,65 +19,100 @@ git commit -m "My informative commit message" git push ``` - Unix-ish Developer Required Software +Unix-ish Developer Required Software -## Required software +## Required software -NOTE: Before reading the following instructions you may want to consider +NOTE: Before reading the following instructions you may want to consider installing the web site as a Docker container. See the instructions below. -1. Make a fork and clone the git repository for bioconductor.org and - create a new branch to make your changes, (helpful documentation for - [Creating a pull request from a fork][]) +1. Make a fork and clone the git repository for bioconductor.org and + create a new branch to make your changes, (helpful documentation for + [Creating a pull request from a fork][]) - git clone https://github.com//bioconductor.org + git clone https://github.com//bioconductor.org -2. Make your changes on this branch, add content or edit content. +2. Build a docker image by navigating to the right directory and running + this command -3. Once the changes are made, you need use the docker image - `bioconductor/website:latest` and run the - container. The container has the dependencies installed to `rake` - the ruby code and host the website on your local machine at - https://localhost:3000. + docker build -t . - docker run -v //bioconductor.org:/bioconductor.org/ \ - -p 3000:3000 \ - bioconductor/website:latest + where, - where, + is the name you want to give to the docker image. + it can be whatever you want. You will need to use it later + but is only seen and used by you. + +3. Run the docker container before making any changes, you need to use the + docker image name `` that you assigned previously to be able to + run the container. The container has the dependencies installed to `rake` + the ruby code and host the website on your local machine at + https://localhost:3000. + + docker run -it -p 3000:3000 \ + -v //bioconductor.org:/opt/bioconductor.org \ + --name \ + /bin/bash + + where, + + -it will take you straight to the container -p is mapping the container's port 3000 to the host machine's port -v mounting a volume, the website (bioconductor.org) directory - from your local machine is being mounted on the docker container + from your local machine is being mounted on the docker container + + is the name you want to give to the docker container. + It will be easier to access the container later if you give it a name + + the command will take you to the container's terminal so you will need to run + + rake + + and + + cd output + adsf + +4. Make your changes on this branch, add content or edit content. + +5. Once the changes are made and you want to be able to see them on + https://localhost:3000, there are two ways to be able to run `rake`: + + by running `rake` inside the docker container shell making sure you + are in the `/opt/bioconductor.org` directory. + + or, -4. Then to kill the process, you need to get the CONTAINER ID with, + without needing to access the docker shell but you will need either the + container name or CONTAINER ID, you can run - docker ps + docker ps - and, + and, - docker kill + docker exec rake -5. Before you run the docker image again with more changes, make sure - to clean the artifacts produced by the `rake` command, with +6. Then to stop the process, you need to get the container name or + CONTAINER ID with, - git clean -xdf + docker ps - The output should look like, + and, - bioconductor.org$ git clean -xdf - Removing assets/bioc-devel-version - Removing assets/bioc-version - Removing assets/config.yaml - Removing content/packages/ - Removing output/ - Removing tmp/ + docker stop -6. Once you have reviewed your changes, make a new branch and send a pull - request to the `devel` branch. The pull request should be made from your - `my_changes` branch to the [devel branch on GitHub][]. +7. If you wish to completely remove the container from your docker once + you stopped it, you can run + + docker rm + +8. Once you have reviewed your changes, make a new branch and send a pull + + request to the `devel` branch. The pull request should be made from your + `my_changes` branch to the [devel branch on GitHub][]. [devel branch on GitHub]: https://github.com/Bioconductor/bioconductor.org [Creating a pull request from a fork]: https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request-from-a-fork @@ -90,68 +125,68 @@ There are numerous issues on various platforms when attempting to install appropriate versions of ruby and the necessary ruby packages. The simplest way around all of this is to use rbenv, which allows you to switch between various ruby versions and avoids conflicts between them. -*NOTE*: rbenv works on Unix only; if you are on Windows, skip to +_NOTE_: rbenv works on Unix only; if you are on Windows, skip to the Windows section. On ubuntu, before proceeding, make sure the `libsqlite3-dev` package is installed (`sudo apt-get install libsqlite3-dev`). -The following instructions are adapted from the +The following instructions are adapted from the [rbenv page](https://github.com/rbenv/rbenv). It's worth reading this to understand how rbenv works. -*Important note*: Never use `sudo` when working with a ruby that has been +_Important note_: Never use `sudo` when working with a ruby that has been installed by rbenv. rbenv installs everything in your home directory so you should never need to become root or fiddle with permissions. -0. Make sure you do not have rvm installed. `which rvm` should not return - anything. If you do have it installed, refer to - [this page](http://stackoverflow.com/questions/3950260/howto-uninstall-rvm) - for instructions on removing it. +0. Make sure you do not have rvm installed. `which rvm` should not return + anything. If you do have it installed, refer to + [this page](http://stackoverflow.com/questions/3950260/howto-uninstall-rvm) + for instructions on removing it. -1. Check out rbenv into `~/.rbenv`. +1. Check out rbenv into `~/.rbenv`. - ~~~ sh + ```sh $ git clone https://github.com/rbenv/rbenv.git ~/.rbenv - ~~~ + ``` -2. Add `~/.rbenv/bin` to your `$PATH` for access to the `rbenv` - command-line utility. +2. Add `~/.rbenv/bin` to your `$PATH` for access to the `rbenv` + command-line utility. - ~~~ sh + ```sh $ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile - ~~~ + ``` **Ubuntu Desktop note**: Modify your `~/.bashrc` instead of `~/.bash_profile`. **Zsh note**: Modify your `~/.zshrc` file instead of `~/.bash_profile`. -3. Add `rbenv init` to your shell to enable shims and autocompletion. +3. Add `rbenv init` to your shell to enable shims and autocompletion. - ~~~ sh + ```sh $ echo 'eval "$(rbenv init -)"' >> ~/.bash_profile - ~~~ + ``` _Same as in previous step, use `~/.bashrc` on Ubuntu, or `~/.zshrc` for Zsh._ -4. Restart your shell so that PATH changes take effect. (Opening a new - terminal tab will usually do it.) Now check if rbenv was set up: +4. Restart your shell so that PATH changes take effect. (Opening a new + terminal tab will usually do it.) Now check if rbenv was set up: - ~~~ sh + ```sh $ type rbenv #=> "rbenv is a function" - ~~~ + ``` -5. Install -[ruby-build](https://github.com/rbenv/ruby-build), -which provides the `rbenv install` command that simplifies the process of -installing new Ruby versions: +5. Install + [ruby-build](https://github.com/rbenv/ruby-build), + which provides the `rbenv install` command that simplifies the process of + installing new Ruby versions: - ~~~ sh - git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build - ~~~ + ```sh + git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build + ``` -Now you need to install ruby. Go to the +Now you need to install ruby. Go to the [Ruby Downloads Page](https://www.ruby-lang.org/en/downloads/) to find out what the current stable version is. As of 3/06/2020 it is 2.7.0 however that particular version still had issues with modules, so I will @@ -171,22 +206,19 @@ If you want to use different versions of ruby in different contexts, read the [rbenv page](https://github.com/rbenv/rbenv) for more information. - - ## Windows Developer Required Software 1. Download and run the one-click ruby installer http://rubyinstaller.org/downloads/. Accept all default settings. 2. Also download and install the Development Kit from - http://rubyinstaller.org/downloads/. Be sure and add the bin dir + http://rubyinstaller.org/downloads/. Be sure and add the bin dir to your path (see devkitvars.bat) 3. If you don't already have it, be sure and install cygwin and explicitly install rsync. rsync is required for parts of the web site to work. - 4. Install git client. https://git-scm.com/downloads 5. Follow the developer setup instructions below. @@ -202,7 +234,6 @@ for more information. Ruby packages are called gems and `gem` is the program used to install them. - To save time, ensure your ~/.gemrc file contains the text gem: --no-document @@ -213,27 +244,25 @@ that you will not use. The web site comes with a Gemfile which is similar to an R package DESCRIPTION file in that it lists all dependencies needed. Gemfiles are read by the `bundler` gem, so install that as follows, prepending `sudo` if -necessary (remember, *don't* use `sudo` if your ruby was installed +necessary (remember, _don't_ use `sudo` if your ruby was installed with `rbenv`: cd bioconductor.org gem install bundler - Then, assuming you are in the bioconductor.org working copy, issue this command to install all dependencies, again prepending `sudo` if necessary: bundle install - ### Build the site cd bioconductor.org # if you aren't already in the working copy rake -One step in the build process runs 'nanoc', "a Ruby web publishing system -for building small to medium-sized websites"; it is one of the -gems you installed above. If you ever need to run nanoc explicitly: +One step in the build process runs 'nanoc', "a Ruby web publishing system +for building small to medium-sized websites"; it is one of the +gems you installed above. If you ever need to run nanoc explicitly: nanoc compile @@ -241,73 +270,106 @@ To run an abbreviated compile, which does not attempt to build all package pages QUICK_NANOC_COMPILE=true nanoc co -Whether run by hand or by rake, the compiled html files are all found in +Whether run by hand or by rake, the compiled html files are all found in and below output/, an immediate subdirectory of the bioconductor.org/ directory -you have been working in. +you have been working in. ### Start the built-in development server, 'adsf' "A dead-simple file" server: cd output adsf - ### Test in a browser by going to http://localhost:3000/ +### Linters + +You will require node and npm to install the linters. +Installation instructions for your specific OS can be found on the node.js website: + +https://nodejs.org/en/download + +Or if you would like to use your package manager to install, you can find instructions here: + +https://nodejs.org/en/download/package-manager + +Install linters: `npm ci` + +This project includes liners for HTML, CSS, JavaScript, and markdown files. +instructions for each +To run all linters you can use the command `npm run lint` +For each linter here are the options available: + +- stylelint (CSS): + + - `npm run lint-css <(optional)directory/file>` (default directory is current working directory) +- eslint (JavaScript): + - `npm run lint-js <(optional)directory/file>` (default directory is current working directory) +- htmllint (HTML) + - `npm run lint-html <(optional)directory/file>` (default directory is current working directory) +- markdownLint (Markdown) + - `npm run lint-md <(required)directory/file>` + ## Overview of site source code -* README.md :: You are reading this file or a file generated from - this file. +- README.md :: You are reading this file or a file generated from + this file. -* Rakefile :: A `Rakefile` is to `rake` as a `Makefile` is to `make`. - You can see the available targets by running `rake -T` - in the directory containing `Rakefile`. +- Rakefile :: A `Rakefile` is to `rake` as a `Makefile` is to `make`. + You can see the available targets by running `rake -T` + in the directory containing `Rakefile`. -* Rules :: This is a Ruby syntax file that describes how site content - is transformed from its source form into its output form - (this is called filtering), what layout to use (layouts are - the shared templates), and where to write the output (this - is called routing). See the nanoc - [tutorial](http://nanoc.stoneship.org/tutorial/) and the - [manual](http://nanoc.stoneship.org/manual/) for details. +- Rules :: This is a Ruby syntax file that describes how site content + is transformed from its source form into its output form + (this is called filtering), what layout to use (layouts are + the shared templates), and where to write the output (this + is called routing). See the nanoc + [tutorial](http://nanoc.stoneship.org/tutorial/) and the + [manual](http://nanoc.stoneship.org/manual/) for details. -* assets :: This directory is not managed by nanoc. It contains files - that do not undergo any filtering, layout-ing, or routing. - Contents of the assets directory are copied to the output - directory using rsync. +- assets :: This directory is not managed by nanoc. It contains files + that do not undergo any filtering, layout-ing, or routing. + Contents of the assets directory are copied to the output + directory using rsync. -* config.yaml :: Nanoc configuration file for the bioconductor.org - site. This file is written in [YAML](http://www.yaml.org/). +- config.yaml :: Nanoc configuration file for the bioconductor.org + site. This file is written in [YAML](http://www.yaml.org/). -* content :: This is where the bulk of the raw (source form) site - content lives. Important details: +- content :: This is where the bulk of the raw (source form) site + content lives. Important details: - - Content always has two related files: a `.yaml` file - containing item attributes and a `.` file - containing the raw source content. You can actually - use whatever extension you want. + - Each page has two related files: + a `.yaml` file containing item attributes and + a `.` file containing the raw source content + this can be `.md` or `.html`. - - The default behavior is that a content file like - `help.md` is filtered into HTML and then written to - `output/help/index.html`. This scheme allows for - clean URLs that avoid having a file extension. + - The default behavior is that a content file like + `install.md` is filtered into HTML and then written to + `output/install/index.html`. This scheme allows for + clean URLs that avoid having a file extension. -* layouts :: This is where the content templates live. + - Folders like `about` living inside content have their own default + `index` files within. -* lib :: Ruby helper functions and nanoc extensions live here. Files - in this directory are automatically loaded by nanoc during - site processing. +- layouts :: This is where the content templates live. Important details: -* migration :: Documentation and scripts used in the process of - migrating the bioconductor.org site from Plone to - nanoc. + - Files that live directly inside the layout folder are the + layouts, the content blocks would live inside /component -* output :: This directory is created when you compile the - bioconductor.org site using nanoc. It contains the final - static HTML and other assets. Deploying the site means - pushing out an update of the contents of output to the - live server. +- lib :: Ruby helper functions and nanoc extensions live here. Files + in this directory are automatically loaded by nanoc during + site processing. -* scripts :: Helper scripts for managing the site live here. +- migration :: Documentation and scripts used in the process of + migrating the bioconductor.org site from Plone to + nanoc. + +- output :: This directory is created when you compile the + bioconductor.org site using nanoc. It contains the final + static HTML and other assets. Deploying the site means + pushing out an update of the contents of output to the + live server. + +- scripts :: Helper scripts for managing the site live here. ## How to add a page @@ -316,13 +378,13 @@ you have been working in. You will use a helper scripts `./scripts/add_event` to add event to the site using the following steps: -1. Always run `./scripts/add_event` from the top-level of your - website working copy -1. Run `./scripts/add_event EVENT_NAME` - This will create an EVENT_NAME.yaml file in the - `./content/help/events/` directory -1. The default `EVENT_NAME.yaml` file will look like this: - +1. Always run `./scripts/add_event` from the top-level of your + website working copy +1. Run `./scripts/add_event EVENT_NAME` + This will create an EVENT_NAME.yaml file in the + `./content/help/events/` directory +1. The default `EVENT_NAME.yaml` file will look like this: + title: TITLE FOR EVENT_NAME location: Seattle, WA, USA event_host: FHCRC @@ -332,16 +394,16 @@ to the site using the following steps: text: details and registration url: https://secure.bioconductor.org/EVENT_NAME -1. Edit the `EVENT_NAME.yaml` file -1. Use git to commit changes and additions by `add_event` - +1. Edit the `EVENT_NAME.yaml` file +1. Use git to commit changes and additions by `add_event` + ## How to add course material You will use a helper script `./scripts/course_mgr` to add course material to the site. PDF files for labs and presentations as well -as course-specific packages and data are *not* stored in git. The +as course-specific packages and data are _not_ stored in git. The index pages that describe the course and provide links to the -materials *are* stored in git. The `course_mgr` script will help +materials _are_ stored in git. The `course_mgr` script will help with index file creation and data transfer. ### `course_mgr` workflow and important tips @@ -359,83 +421,82 @@ To add a course, you will typically perform the following steps ### Using `course_mgr` -1. Generate a skeleton course directory structure. - - ./scripts/course_mgr --create seattle-intro - - This will create a `seattle-intro/` directory in the top-level - of your website working copy -- do not add this directory or any - files within it to git. Inside will be a `course_config.yaml` - file that will look like this: - - title: - The title of the course goes here - start_date: 2010-01-27 - end_date: 2010-01-29 - instructors: ["Someone", "Another"] - location: "Seattle, USA" - url: https://secure.bioconductor.org/SeattleJan10/ - tags: ["intro", "seattle", "package"] - description: - You can put some description text here. - Must be indented. - -2. Put course materials as files and directories into the skeleton - directory. For example, you might end up with a directory like - that shown below with two subdirectories, `packages` and - `presentation-slides`, each containing course materials. - - seattle-intro - |-- course_config.yaml - |-- packages - | |-- day1_0.0.1.tar.gz - | |-- day2_0.0.1.tar.gz - | `-- day3_0.0.1.tar.gz - `-- presentation-slides - |-- First-steps-presentation.pdf - |-- Microarray-presentation.pdf - |-- annotation-presentation.pdf - `-- sequence-presentation.pdf - -3. Now you are ready to create the index files. - - ./scripts/course_mgr --index seattle-intro - CREATED: content/help/course-notes/2010/01/seattle-intro.(html|yaml) - COPIED for preview: - src: ./seattle-intro/* - dst: output/help/course-notes/2010/01/seattle-intro/ - NEXT STEPS: - - preview site with 'rake devserver' - - Use URL: http://localhost:3000/help/course-materials/2010/seattle-intro/ - - edit CREATED files to add descriptions for links - - if happy, run ./scripts/course_mgr --push 2010/seattle-intro - - - This will create a course index content item in content filed - appropriately based on the metadata provided in - `course_config.yaml`. It will also copy the files and directories - you created into the output directory so that you can do a full - preview after compiling the site. - -4. If everything looks good, you can sync the data files to the web - server (note that we do not put these files in git because large - data files are not appropriate for git and they are not likely to - change): - - ./scripts/course_mgr --push 2010/seattle-intro - SYNC: - src: ./seattle-intro - dst: biocadmin@staging.bioconductor.org:/loc/www/bioconductor-test.fhcrc.org/help/course-materials/2010/ - NEXT STEPS: git add/commit changes in contents - -5. Finally, "git add" the new course index html and yaml files that were generated in the - content directory and commit. +1. Generate a skeleton course directory structure. + + ./scripts/course_mgr --create seattle-intro + + This will create a `seattle-intro/` directory in the top-level + of your website working copy -- do not add this directory or any + files within it to git. Inside will be a `course_config.yaml` + file that will look like this: + + title: + The title of the course goes here + start_date: 2010-01-27 + end_date: 2010-01-29 + instructors: ["Someone", "Another"] + location: "Seattle, USA" + url: https://secure.bioconductor.org/SeattleJan10/ + tags: ["intro", "seattle", "package"] + description: + You can put some description text here. + Must be indented. + +2. Put course materials as files and directories into the skeleton + directory. For example, you might end up with a directory like + that shown below with two subdirectories, `packages` and + `presentation-slides`, each containing course materials. + + seattle-intro + |-- course_config.yaml + |-- packages + | |-- day1_0.0.1.tar.gz + | |-- day2_0.0.1.tar.gz + | `-- day3_0.0.1.tar.gz + `-- presentation-slides + |-- First-steps-presentation.pdf + |-- Microarray-presentation.pdf + |-- annotation-presentation.pdf + `-- sequence-presentation.pdf + +3. Now you are ready to create the index files. + + ./scripts/course_mgr --index seattle-intro + CREATED: content/help/course-notes/2010/01/seattle-intro.(html|yaml) + COPIED for preview: + src: ./seattle-intro/* + dst: output/help/course-notes/2010/01/seattle-intro/ + NEXT STEPS: + - preview site with 'rake devserver' + - Use URL: http://localhost:3000/help/course-materials/2010/seattle-intro/ + - edit CREATED files to add descriptions for links + - if happy, run ./scripts/course_mgr --push 2010/seattle-intro + + This will create a course index content item in content filed + appropriately based on the metadata provided in + `course_config.yaml`. It will also copy the files and directories + you created into the output directory so that you can do a full + preview after compiling the site. + +4. If everything looks good, you can sync the data files to the web + server (note that we do not put these files in git because large + data files are not appropriate for git and they are not likely to + change): + + ./scripts/course_mgr --push 2010/seattle-intro + SYNC: + src: ./seattle-intro + dst: biocadmin@staging.bioconductor.org:/loc/www/bioconductor-test.fhcrc.org/help/course-materials/2010/ + NEXT STEPS: git add/commit changes in contents + +5. Finally, "git add" the new course index html and yaml files that were generated in the + content directory and commit. ### Modifying an existing course You can edit the pages for an existing course by editing the files in `./content`. If you need to add or modify data files, run: - ./scripts/course_mgr --pull 2010/course_to_modify +./scripts/course_mgr --pull 2010/course_to_modify This will create a top-level directory called "course_to_modify". You can then add or modify course material. When finished, run @@ -445,13 +506,11 @@ You can edit the pages for an existing course by editing the files in cp course_to_modify/course_to_modify.* content/help/course_materials/2010 git commit -m "made changes" content/help/course-materials/2010/course_to_modify - - ## Adding course material to the spreadsheet The page -[http://www.bioconductor.org/help/course-materials/](http://www.bioconductor.org/help/course-materials/) -is built from the tab-delimited file `etc/course_descriptions.tsv`. +[http://www.bioconductor.org/help/course-materials/](http://www.bioconductor.org/help/course-materials/) +is built from the tab-delimited file `etc/course_descriptions.tsv`. Add information to this file using a spreadsheet program (Excel, LibreOffice, etc.). Be sure to save @@ -518,7 +577,6 @@ deployment, and log rotation (biocadmin user): */20 * * * * cd $HOME/bioc-test-web;./update_site >> log/update_site.log 2>&1 59 23 * * * /usr/sbin/logrotate -f -s /home/biocadmin/bioc-test-web/logrotateState /home/biocadmin/bioc-test-web/logrotateFiles - ### master.bioconductor.org Apache Configuration A good resource is available [http://en.opensuse.org/Apache_Quickstart_HOWTO](here). @@ -582,7 +640,7 @@ Edit /etc/apache2/sites-available/000-default.conf BrowserMatch \bMSIE !no-gzip !gzip-only-text/html - + Options Indexes FollowSymLinks @@ -635,7 +693,6 @@ Edit /etc/apache2/sites-available/000-default.conf - ## How to test for broken links You can run wget as shown below to get a report on 404s for the site. Note @@ -643,7 +700,6 @@ that this runs against the staging site so will have a lot of false positives. wget -r --spider -U "404 check with wget" -o wwwbioc.log http://master.bioconductor.org - ## Optimize redirects Currently the redirects are defined using Apache's mod_rewrite in a @@ -662,13 +718,13 @@ following changes: top-level directory. This should disable .htaccess files as it isn't enough just to remove the .htaccess file itself. - ### Site Search -The site search contains several moving parts. The search is built on +The site search contains several moving parts. The search is built on Apache Solr, which is in turn built on top of Apache Lucene. #### How to configure Solr + The default SOLR installation works fine, with the exception of the file example/solr/conf/schema.xml which must be replaced with the version in this subversion repository at etc/solr.The changes in this file enable @@ -679,8 +735,8 @@ where the solr tarball has been expanded): cd $SOLR_HOME/example; java -jar start.jar - #### How to ensure that Solr is started up at boot time (on master and staging) + On both machines there is an /etc/rc.local and /etc/init.d/rc.local script which starts Solr as above. @@ -700,13 +756,13 @@ to the Apache web server. Then we added the following if it hasn't already to ProxyStatus On This means that all requests starting with "/solr" will go to the -solr server on port 8983. This allows us to make requests to the +solr server on port 8983. This allows us to make requests to the search server without violating the "same-origin" policy. #### How the client-side portion of the search works The page /search/index.html includes some javascript (in the file -js/search.html) which in turn uses jQuery. The code parses the +js/search.html) which in turn uses jQuery. The code parses the arguments in the URL and then makes an AJAX request to the SOLR server which returns a JSON string. The javascript code converts that to an object and then renders the search response page. @@ -714,10 +770,12 @@ that to an object and then renders the search response page. #### How to rebuild the search index Note that you typically do not want to do this by hand as it is handled -by cron jobs (see below). +by cron jobs (see below). # NOTE: this may need debugging for staging.bioconductor.org -# from transition from merlot2 + +# from transition from merlot2 + On staging.bioconductor.org (ssh to staging.bioconductor.org): cd ~/biocadmin/bioc-test-web/bioconductor.org @@ -725,20 +783,19 @@ On staging.bioconductor.org (ssh to staging.bioconductor.org): What this command does: -* Runs a Ruby class which determines which files need to be (re)indexed. -* This uses a cache file containing the names of each file and their modification times - as of the last time the script was run. If the cache file does not exist, all files +- Runs a Ruby class which determines which files need to be (re)indexed. +- This uses a cache file containing the names of each file and their modification times + as of the last time the script was run. If the cache file does not exist, all files are indexed. This class also handles new files and deletions. -* The class actually does not do the indexing itself; it creates another script +- The class actually does not do the indexing itself; it creates another script (index.sh -- created by scripts/search_indexer.rb) which does the actual indexing, which is accomplished by using curl to post files to the SOLR web app. To re-index files on master, ssh to staging (not master) and do this: - + cd ~/biocadmin/bioc-test-web/bioconductor.org rake index_production - #### Cron jobs for rebuilding the search index/why it is decoupled from site update Doing "crontab -l" on staging shows how the index us updated on master. Here are the relevant lines: @@ -747,12 +804,11 @@ Doing "crontab -l" on staging shows how the index us updated on master. Here are 30 */4 * * * cd $HOME/bioc-test-web/bioconductor.org && rake index_production > $HOME/bioc-test-web/production_index.log 2>&1 Notice that the search indexing process is decoupled from the site building process -(which takes place every 30 minutes). Site indexing can be a time-consuming -process (especially on master) and the site rebuilding should be quick. So +(which takes place every 30 minutes). Site indexing can be a time-consuming +process (especially on master) and the site rebuilding should be quick. So the search indexing takes place once a day on staging at 8 pm on master (where there are many more files to be indexed which originate from the build system). - ### BiocViews Pages The BiocViews pages are generated by a three-step process: @@ -787,40 +843,40 @@ installed. This is done by nanoc and handled by the DataSource subclass BiocViews (found in lib/data_sources/bioc_views.rb). This data source uses the JSON files generated in the previous step to build a single page for -each page, one for release and one for devel. The pages are rendered -by the partial layouts/_bioc_views_package_detail.html. +each page, one for release and one for devel. The pages are rendered +by the partial layouts/\_bioc_views_package_detail.html. #### Step 3: The BiocViews Hierarchy page -At http://bioconductor.org/packages. This page uses javascript to -build the tree, reading in data generated in step 1. The relevant +At http://bioconductor.org/packages. This page uses javascript to +build the tree, reading in data generated in step 1. The relevant Javascript file is assets/js/bioc_views.js. The automatically generated (by rake) file output/js/versions.js is also sourced. ### Updating the site during a release Take a look at the config.yaml file in the root of the -bioconductor.org working copy. This should be the only place you need +bioconductor.org working copy. This should be the only place you need to make changes. -# Standard Operating Procedures / SOPs / Troubleshooting +# Standard Operating Procedures / SOPs / Troubleshooting ## Problem: Web site does not seem to be updating -Symptom: Commits you made are not going through, and/or +Symptom: Commits you made are not going through, and/or the dashboard (http://bioconductor.org/dashboard/) says that the site has not been updated in over 20 minutes. It likely means that an error was introduced in a recent commit. (make sure you haven't forgotten to `git add` any files). -Solution: ssh to biocadmin@staging.bioconductor.org (ask Lori if +Solution: ssh to biocadmin@staging.bioconductor.org (ask Lori if you don't have permission to do so). Change directories: cd ~/bioc-test-web Look at the 2015 Oct 29 10:22:19 AM then its contents are relevant. You can also look at the last -few lines of `./log/update_site.log`. +few lines of `./log/update_site.log`. # Updating Ruby or Gems diff --git a/assets/help/bioc-views.html b/assets/help/bioc-views.html index 33bd68109..c224f5c99 100644 --- a/assets/help/bioc-views.html +++ b/assets/help/bioc-views.html @@ -1,5 +1,7 @@ - - + <%= script_tag_for_package_data(@item) %> @@ -8,52 +10,43 @@ - - - - - - - + + + - -

All Packages

- - - - - +
-
-
-

Bioconductor version

-
-

 

-

- - Developers: check this box - to toggle the visibility of childless biocViews. -

-
- -
- - -

 

-
- -
-
-
-
+
+

+ Bioconductor version +

+
+

+ + Developers: check this box to toggle the visibility of childless + biocViews. +

-
+
+ + +
+
+
- - \ No newline at end of file +
+
+
diff --git a/assets/images/Doodles/Doodle-1.png b/assets/images/Doodles/Doodle-1.png new file mode 100644 index 000000000..19b1ee0ae Binary files /dev/null and b/assets/images/Doodles/Doodle-1.png differ diff --git a/assets/images/Doodles/Doodle-2.png b/assets/images/Doodles/Doodle-2.png new file mode 100644 index 000000000..f30b37457 Binary files /dev/null and b/assets/images/Doodles/Doodle-2.png differ diff --git a/assets/images/Doodles/code-left.png b/assets/images/Doodles/code-left.png new file mode 100644 index 000000000..8ea5a7dde Binary files /dev/null and b/assets/images/Doodles/code-left.png differ diff --git a/assets/images/Doodles/code-right.png b/assets/images/Doodles/code-right.png new file mode 100644 index 000000000..08aa9a981 Binary files /dev/null and b/assets/images/Doodles/code-right.png differ diff --git a/assets/images/examples/gallery-1.png b/assets/images/examples/gallery-1.png new file mode 100644 index 000000000..f15fd97ff Binary files /dev/null and b/assets/images/examples/gallery-1.png differ diff --git a/assets/images/examples/gallery-2.png b/assets/images/examples/gallery-2.png new file mode 100644 index 000000000..5e5e7eb5b Binary files /dev/null and b/assets/images/examples/gallery-2.png differ diff --git a/assets/images/examples/gallery-3.png b/assets/images/examples/gallery-3.png new file mode 100644 index 000000000..0176c3628 Binary files /dev/null and b/assets/images/examples/gallery-3.png differ diff --git a/assets/images/examples/gallery-4.png b/assets/images/examples/gallery-4.png new file mode 100644 index 000000000..5ac7c0b3e Binary files /dev/null and b/assets/images/examples/gallery-4.png differ diff --git a/assets/images/examples/gallery-5.png b/assets/images/examples/gallery-5.png new file mode 100644 index 000000000..d8925d51f Binary files /dev/null and b/assets/images/examples/gallery-5.png differ diff --git a/assets/images/examples/gallery-6.png b/assets/images/examples/gallery-6.png new file mode 100644 index 000000000..f7241778f Binary files /dev/null and b/assets/images/examples/gallery-6.png differ diff --git a/assets/images/examples/gallery-7.png b/assets/images/examples/gallery-7.png new file mode 100644 index 000000000..5de9fdb38 Binary files /dev/null and b/assets/images/examples/gallery-7.png differ diff --git a/assets/images/examples/gallery-8.png b/assets/images/examples/gallery-8.png new file mode 100644 index 000000000..3cbe2769e Binary files /dev/null and b/assets/images/examples/gallery-8.png differ diff --git a/assets/images/examples/gallery-9.png b/assets/images/examples/gallery-9.png new file mode 100644 index 000000000..6ef950434 Binary files /dev/null and b/assets/images/examples/gallery-9.png differ diff --git a/assets/images/examples/medical.png b/assets/images/examples/medical.png new file mode 100644 index 000000000..9a515ac4a Binary files /dev/null and b/assets/images/examples/medical.png differ diff --git a/assets/images/icons/Join-Data-Scientists.png b/assets/images/icons/Join-Data-Scientists.png new file mode 100644 index 000000000..5574d675f Binary files /dev/null and b/assets/images/icons/Join-Data-Scientists.png differ diff --git a/assets/images/icons/Join-Developers.png b/assets/images/icons/Join-Developers.png new file mode 100644 index 000000000..83e1f611b Binary files /dev/null and b/assets/images/icons/Join-Developers.png differ diff --git a/assets/images/icons/Step 1 quote.svg b/assets/images/icons/Step 1 quote.svg new file mode 100644 index 000000000..8f662a68d --- /dev/null +++ b/assets/images/icons/Step 1 quote.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/icons/Step 2 quote.svg b/assets/images/icons/Step 2 quote.svg new file mode 100644 index 000000000..5bdfb6fcb --- /dev/null +++ b/assets/images/icons/Step 2 quote.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/icons/Step 3 quote.svg b/assets/images/icons/Step 3 quote.svg new file mode 100644 index 000000000..a4f743aad --- /dev/null +++ b/assets/images/icons/Step 3 quote.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/icons/chevron-down.jpg b/assets/images/icons/chevron-down.jpg new file mode 100644 index 000000000..e39ee0107 Binary files /dev/null and b/assets/images/icons/chevron-down.jpg differ diff --git a/assets/images/icons/search-icon.svg b/assets/images/icons/search-icon.svg new file mode 100644 index 000000000..adf09d145 --- /dev/null +++ b/assets/images/icons/search-icon.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/assets/images/icons/slack.png b/assets/images/icons/slack.png new file mode 100644 index 000000000..6931dfe0b Binary files /dev/null and b/assets/images/icons/slack.png differ diff --git a/assets/images/icons/svgs/DNA.svg b/assets/images/icons/svgs/DNA.svg new file mode 100644 index 000000000..ad81757d1 --- /dev/null +++ b/assets/images/icons/svgs/DNA.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/icons/svgs/Packages.svg b/assets/images/icons/svgs/Packages.svg new file mode 100644 index 000000000..d1b19a0d2 --- /dev/null +++ b/assets/images/icons/svgs/Packages.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/assets/images/icons/svgs/arrow-circle-right-blue.svg b/assets/images/icons/svgs/arrow-circle-right-blue.svg new file mode 100644 index 000000000..1ccfbdc1f --- /dev/null +++ b/assets/images/icons/svgs/arrow-circle-right-blue.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/icons/svgs/arrow-circle-right-white.svg b/assets/images/icons/svgs/arrow-circle-right-white.svg new file mode 100644 index 000000000..15518c7a9 --- /dev/null +++ b/assets/images/icons/svgs/arrow-circle-right-white.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/icons/svgs/arrow-circle-right.svg b/assets/images/icons/svgs/arrow-circle-right.svg new file mode 100644 index 000000000..f5131338f --- /dev/null +++ b/assets/images/icons/svgs/arrow-circle-right.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/images/icons/svgs/chevron-down.svg b/assets/images/icons/svgs/chevron-down.svg new file mode 100644 index 000000000..e650cadb8 --- /dev/null +++ b/assets/images/icons/svgs/chevron-down.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/icons/svgs/chevron-right-n400.svg b/assets/images/icons/svgs/chevron-right-n400.svg new file mode 100644 index 000000000..cf6f4d5f6 --- /dev/null +++ b/assets/images/icons/svgs/chevron-right-n400.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/icons/svgs/chevron-right-purple-chip.svg b/assets/images/icons/svgs/chevron-right-purple-chip.svg new file mode 100644 index 000000000..ee484d103 --- /dev/null +++ b/assets/images/icons/svgs/chevron-right-purple-chip.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/assets/images/icons/svgs/chevron-right-sidebar.svg b/assets/images/icons/svgs/chevron-right-sidebar.svg new file mode 100644 index 000000000..2d06e0b95 --- /dev/null +++ b/assets/images/icons/svgs/chevron-right-sidebar.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/icons/svgs/chevron-right.svg b/assets/images/icons/svgs/chevron-right.svg new file mode 100644 index 000000000..d25b3a47d --- /dev/null +++ b/assets/images/icons/svgs/chevron-right.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/icons/svgs/linkedin.svg b/assets/images/icons/svgs/linkedin.svg new file mode 100644 index 000000000..8bbe5e742 --- /dev/null +++ b/assets/images/icons/svgs/linkedin.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/images/icons/svgs/mastodon.svg b/assets/images/icons/svgs/mastodon.svg new file mode 100644 index 000000000..3938f41b3 --- /dev/null +++ b/assets/images/icons/svgs/mastodon.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/icons/svgs/question-mark-circle.svg b/assets/images/icons/svgs/question-mark-circle.svg new file mode 100644 index 000000000..b0d01fc66 --- /dev/null +++ b/assets/images/icons/svgs/question-mark-circle.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/icons/svgs/twitter.svg b/assets/images/icons/svgs/twitter.svg new file mode 100644 index 000000000..fc2c7effe --- /dev/null +++ b/assets/images/icons/svgs/twitter.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/images/icons/svgs/youtube.svg b/assets/images/icons/svgs/youtube.svg new file mode 100644 index 000000000..7fcb8c55b --- /dev/null +++ b/assets/images/icons/svgs/youtube.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/images/logo/svg/BC-Logo-White.svg b/assets/images/logo/svg/BC-Logo-White.svg new file mode 100644 index 000000000..225261e2e --- /dev/null +++ b/assets/images/logo/svg/BC-Logo-White.svg @@ -0,0 +1,79 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/images/logo/svg/Logo.svg b/assets/images/logo/svg/Logo.svg new file mode 100644 index 000000000..5d9ea8026 --- /dev/null +++ b/assets/images/logo/svg/Logo.svg @@ -0,0 +1,83 @@ + + + + + + + + diff --git a/assets/images/masthead_nav_fade.gif b/assets/images/masthead_nav_fade.gif deleted file mode 100644 index fc33473a2..000000000 Binary files a/assets/images/masthead_nav_fade.gif and /dev/null differ diff --git a/assets/images/profiles/charlie.jpg b/assets/images/profiles/charlie.jpg new file mode 100644 index 000000000..3b50871d0 Binary files /dev/null and b/assets/images/profiles/charlie.jpg differ diff --git a/assets/images/profiles/profile.jpg b/assets/images/profiles/profile.jpg new file mode 100644 index 000000000..6ee7af5b0 Binary files /dev/null and b/assets/images/profiles/profile.jpg differ diff --git a/assets/images/site_bg.jpg b/assets/images/site_bg.jpg deleted file mode 100644 index 0a56282a5..000000000 Binary files a/assets/images/site_bg.jpg and /dev/null differ diff --git a/assets/js/bioc_views.js b/assets/js/bioc_views.js index eb96fec28..ec801b527 100644 --- a/assets/js/bioc_views.js +++ b/assets/js/bioc_views.js @@ -3,552 +3,523 @@ var biocVersion; var timeoutId; function hasOwnProperty(obj, prop) { - var proto = obj.__proto__ || obj.constructor.prototype; - return (prop in obj) && - (!(prop in proto) || proto[prop] !== obj[prop]); + var proto = obj.__proto__ || obj.constructor.prototype; + return prop in obj && (!(prop in proto) || proto[prop] !== obj[prop]); } -if ( Object.prototype.hasOwnProperty ) { - var hasOwnProperty = function(obj, prop) { - return obj.hasOwnProperty(prop); - } +if (Object.prototype.hasOwnProperty) { + var hasOwnProperty = function (obj, prop) { + return obj.hasOwnProperty(prop); + }; } -var displayPackages = function(packageList, nodeName) { - if (packageList == null) { - jQuery("#packages").empty(); - return; - } - jQuery(".jstree li:not([id])").hide(); // hide childless views - - var html = "

Packages found under " + nodeName + ":

\n

Rank based on number of downloads: lower numbers are more frequently downloaded.

\n"; - var parents = findParents(nodeName); - - var category = parents[0]; - - var map = {"Software": "bioc", "AnnotationData": "data/annotation", "ExperimentData": "data/experiment", "Workflow": "workflows"}; - - html += "\n"; - - - var tableData = ""; - for (var i = 0; i < packageList.length; i++) { - var rowClass = (i % 2 == 0) ? "row_odd" : "row_even"; - var pkg = packageList[i]; - var url = getHostUrl() + "/" + map[category] + "/html/" + pkg + ".html" - //tableData += '\n'; - tableData += '\n'; - tableData += '\t\n'; - var cleanMaintainer = packageInfo[pkg]["Maintainer"].replace(/ *<[^>]*>/g, ""); - tableData += '\t\n'; - tableData += '\t\n'; - tableData += '\t\n'; - tableData += "\n"; - } - html += tableData; - - html += "
PackageMaintainerTitleRank
'+pkg+''+cleanMaintainer+''+packageInfo[pkg]["Title"]+''+packageInfo[pkg]["Rank"]+'
\n"; - - jQuery.fn.dataTableExt.oStdClasses.sStripeOdd = "row_odd"; - jQuery.fn.dataTableExt.oStdClasses.sStripeEven = "row_even"; - - jQuery.fn.dataTableExt.oSort['numWithNull-asc'] = function(a,b) { +var displayPackages = function (packageList, nodeName) { + if (packageList == null) { + jQuery("#packages").empty(); + return; + } + jQuery(".jstree li:not([id])").hide(); // hide childless views + + var html = + "

Packages found under " + + nodeName + + ":

\n

Rank based on number of downloads: lower numbers are more frequently downloaded.

\n"; + var parents = findParents(nodeName); + + var category = parents[0]; + + var map = { + Software: "bioc", + AnnotationData: "data/annotation", + ExperimentData: "data/experiment", + Workflow: "workflows", + }; + + html += + "\n"; + + var tableData = ""; + for (var i = 0; i < packageList.length; i++) { + var rowClass = i % 2 == 0 ? "row_odd" : "row_even"; + var pkg = packageList[i]; + var url = getHostUrl() + "/" + map[category] + "/html/" + pkg + ".html"; + //tableData += '\n'; + tableData += '\n'; + tableData += '\t\n"; + var cleanMaintainer = packageInfo[pkg]["Maintainer"].replace( + / *<[^>]*>/g, + "" + ); + tableData += "\t\n"; + tableData += "\t\n"; + tableData += "\t\n"; + tableData += "\n"; + } + html += tableData; + + html += "
PackageMaintainerTitleRank
' + pkg + "" + cleanMaintainer + "" + packageInfo[pkg]["Title"] + "" + packageInfo[pkg]["Rank"] + "
\n"; + + jQuery.fn.dataTableExt.oStdClasses.sStripeOdd = "row_odd"; + jQuery.fn.dataTableExt.oStdClasses.sStripeEven = "row_even"; + + jQuery.fn.dataTableExt.oSort["numWithNull-asc"] = function (a, b) { var x = parseInt(a); var y = parseInt(b); - return ((isNaN(y) || x < y) ? -1 : ((isNaN(x) || x > y) ? 1 : 0)); - }; - jQuery.fn.dataTableExt.oSort['numWithNull-desc'] = function(a,b) { + return isNaN(y) || x < y ? -1 : isNaN(x) || x > y ? 1 : 0; + }; + jQuery.fn.dataTableExt.oSort["numWithNull-desc"] = function (a, b) { var x = parseInt(a); var y = parseInt(b); - return ((isNaN(x) || x < y) ? 1 : ((isNaN(y) || x > y) ? -1 : 0)); - }; - jQuery("#packages").html(html); - jQuery("#biocViews_package_table").dataTable({ - sScrollX: "100%", - "aLengthMenu": [ - [-1, 10, 25, 50, 100], - ["All", 10, 25, 50, 100] - ], - "iDisplayLength": -1, - "aoColumns": [ - null, - null, - null, - { "sType" : "numWithNull" } + return isNaN(x) || x < y ? 1 : isNaN(y) || x > y ? -1 : 0; + }; + jQuery("#packages").html(html); + jQuery("#biocViews_package_table").dataTable({ + sScrollX: "100%", + aLengthMenu: [ + [-1, 10, 25, 50, 100], + ["All", 10, 25, 50, 100], ], - "aaSorting": [[3, 'asc']], - "oLanguage": { - "sSearch": "Search table:" - } - }); - -} - - -var jumpToAnchor = function() { - var tmp = ("" + window.location).split("#"); - document.getElementById('treeTop').scrollIntoView(true); -} - -var nodeSelected = function(event, data){ - var nodeName; - if (typeof data == 'string' || data instanceof String) { - // we got here from the autocomplete box - - nodeName = data; - } else { - // we got here from clicking on a tree node, - // so clear the autocompleter - jQuery("#autocompleter").val(""); - - - // for IE - nodeName = data['args'][0]['innerText']; - - if (data['args'][0]['text'] != undefined) { - nodeName = data['args'][0]['text']; - } - - - - if (nodeName == undefined) { - nodeName = getNodeName(); - } - - //console.log("nodeName is " + nodeName); - nodeName = nodeName.trim(); + iDisplayLength: -1, + aoColumns: [null, null, null, { sType: "numWithNull" }], + aaSorting: [[3, "asc"]], + oLanguage: { + sSearch: "Search table:", + }, + }); +}; + +var jumpToAnchor = function () { + var tmp = ("" + window.location).split("#"); + document.getElementById("treeTop").scrollIntoView(true); +}; + +var nodeSelected = function (event, data) { + var nodeName; + if (typeof data == "string" || data instanceof String) { + // we got here from the autocomplete box + + nodeName = data; + } else { + // we got here from clicking on a tree node, + // so clear the autocompleter + jQuery("#autocompleter").val(""); + + // for IE + nodeName = data["args"][0]["innerText"]; + + if (data["args"][0]["text"] != undefined) { + nodeName = data["args"][0]["text"]; } - var bareNodeName = nodeName.split(" ")[0]; - var wl = ("" + window.location.href).split("?")[0]; - wl = wl.split("#")[0]; - - var newUrl = "" + wl + "#" + "___" + bareNodeName; - window.location.href = newUrl; - - var tmp = nodeName.split(" "); - nodeName = tmp[0]; - var packageList = getAllPackages(nodeName); - if (packageList.length > 0) { - displayPackages(packageList, nodeName); - } else { - displayPackages(null, nodeName); + if (nodeName == undefined) { + nodeName = getNodeName(); } - //jumpToAnchor(); -} - - -var setBiocVersion = function() { - - var href = window.location.href; - - - if (href.match(new RegExp("/" + releaseVersion + "/"))) { - biocVersion = releaseVersion; - } else if (href.match(new RegExp("/" + develVersion + "/"))) { - biocVersion = develVersion; - } else if (href.toLowerCase().match(new RegExp("/release/"))) { - biocVersion = releaseVersion; - } else if (href.toLowerCase().match(new RegExp("/devel/"))) { - biocVersion = develVersion; - } else if (href.match(/\/packages\/([^/]*)\//)) { - biocVersion = RegExp.$1; - } - - - - var versionText; - - if (biocVersion == releaseVersion) { - versionText = "Release" - } else if (biocVersion == develVersion) { - versionText = "Development"; - } else { - versionText =""; - } - - var versionString = biocVersion; - if (versionText != "") { - versionString += " (" + versionText + ")"; - } - - - jQuery("#bioc_version").html(versionString); -} + //console.log("nodeName is " + nodeName); + nodeName = nodeName.trim(); + } + + var bareNodeName = nodeName.split(" ")[0]; + var wl = ("" + window.location.href).split("?")[0]; + wl = wl.split("#")[0]; + + var newUrl = "" + wl + "#" + "___" + bareNodeName; + window.location.href = newUrl; + + var tmp = nodeName.split(" "); + nodeName = tmp[0]; + var packageList = getAllPackages(nodeName); + if (packageList.length > 0) { + displayPackages(packageList, nodeName); + } else { + displayPackages(null, nodeName); + } + //jumpToAnchor(); +}; + +var setBiocVersion = function () { + var href = window.location.href; + + if (href.match(new RegExp("/" + releaseVersion + "/"))) { + biocVersion = releaseVersion; + } else if (href.match(new RegExp("/" + develVersion + "/"))) { + biocVersion = develVersion; + } else if (href.toLowerCase().match(new RegExp("/release/"))) { + biocVersion = releaseVersion; + } else if (href.toLowerCase().match(new RegExp("/devel/"))) { + biocVersion = develVersion; + } else if (href.match(/\/packages\/([^/]*)\//)) { + biocVersion = RegExp.$1; + } + + var versionText; + + if (biocVersion == releaseVersion) { + versionText = "Release"; + } else if (biocVersion == develVersion) { + versionText = "Development"; + } else { + versionText = ""; + } + + var versionString = biocVersion; + if (versionText != "") { + versionString += " (" + versionText + ")"; + } + + jQuery("#bioc_version").html(versionString); +}; var findParents = function (nodeId) { - var parents = jQuery("#" + nodeId).parentsUntil("#tree"); - var ret = []; - ret.push(nodeId); - jQuery.each(parents, function(index, value){ - var id = jQuery(value).attr("id"); - if (typeof id === "undefined") { - // ignore items w/o id attr - } else { - if (id.length > 0) { - ret.push(id); - } - } - }); - ret.reverse(); - return ret; -} - -var getNodeName = function() { - var wlh = window.location.href; - var segs = []; - segs = wlh.split("#"); - if (segs.length == 2) { - return segs[1].replace("___", ""); + var parents = jQuery("#" + nodeId).parentsUntil("#tree"); + var ret = []; + ret.push(nodeId); + jQuery.each(parents, function (index, value) { + var id = jQuery(value).attr("id"); + if (typeof id === "undefined") { + // ignore items w/o id attr } else { - return ""; + if (id.length > 0) { + ret.push(id); + } } -} - -var init = function() { - // todo add ajax failure method (possible?) - - var initiallySelected = []; - var nodeName = ""; - nodeName = getNodeName(); - - if (nodeName != "") { - initiallySelected.push(nodeName); - } - - jQuery("#tree").jstree({ - "core": { - "animation": 0 - }, - "ui": { - "initially_select": initiallySelected - }, - "themes": { - "theme": "apple", - "dots": false, - "icons": false - }, - "json_data": dataTree, - "plugins" : [ "themes", "json_data", "ui" ] - }); - - - // explicitly add biocViewsTree class because the widget strips it off - jQuery("#tree").addClass("biocViewsTree"); - - - /* + }); + ret.reverse(); + return ret; +}; + +var getNodeName = function () { + var wlh = window.location.href; + var segs = []; + segs = wlh.split("#"); + if (segs.length == 2) { + return segs[1].replace("___", ""); + } else { + return ""; + } +}; + +var init = function () { + // todo add ajax failure method (possible?) + + var initiallySelected = []; + var nodeName = ""; + nodeName = getNodeName(); + + if (nodeName != "") { + initiallySelected.push(nodeName); + } + + jQuery("#tree").jstree({ + core: { + animation: 0, + }, + ui: { + initially_select: initiallySelected, + }, + themes: { + theme: "apple", + dots: false, + icons: false, + }, + json_data: dataTree, + plugins: ["themes", "json_data", "ui"], + }); + + // explicitly add biocViewsTree class because the widget strips it off + jQuery("#tree").addClass("biocViewsTree"); + + /* jQuery("#tree").bind("close_node.jstree dblclick.jstree delete_node.jstree deselect_node.jstree destroy.jstree drag_start.vakata drag_stop.vakata get_rollback.jstree init.jstree load_node.jstree loaded.jstree mousedown.jstree move_node.jstree open_node.jstree rename_node.jstree reopen.jstree select_node.jstree set_rollback.jstree ", function (event, data) { log("event name: " + event.type); }) */ - jQuery("#tree").bind("select_node.jstree", function(event, data){ - nodeSelected(event, data); - }); + jQuery("#tree").bind("select_node.jstree", function (event, data) { + nodeSelected(event, data); + }); - jQuery("#tree").bind("loaded.jstree", function(event, data){ - var initiallyOpen = []; - var openNode = getNodeName(); + jQuery("#tree").bind("loaded.jstree", function (event, data) { + var initiallyOpen = []; + var openNode = getNodeName(); - if (openNode != "") { - initiallyOpen = findParents(openNode); - for(var i = 0; i < initiallyOpen.length; i++) { - jQuery("#tree").jstree("open_node", "#" + initiallyOpen[i]); - } - } - }); - - - // This exists because the tree would disappear if the selected - // node was collapsed (only if the selected node was >1 level in - // and matched what was in the url bar). For some reason this fixes it. - jQuery("#tree").bind("close_node.jstree", function(event, data){ - timeoutId = window.setTimeout(onTimeout, 1); - - function onTimeout() { - var vis; - do { - jQuery("#tree").toggle(); - vis = jQuery("#tree").is(":visible"); - } while(vis == false); - } - - - }); - - jQuery("#tree-toggler").click(function(){ - jQuery(".jstree li:not([id])").toggle(); - }); - - - - -} - - - -var getHostUrl = function() { - var url = window.location.href; - var segs = url.split("/"); - segs.pop(); - url = segs.join("/"); - return(url); -} - -var addToPackageInfo = function(data) { - var ret = {}; - var content = data['content']; - for (var i = 0; i < content.length; i++) { - var pkg = content[i][0]; - var maintainer = content[i][1]; - var title = content[i][2]; - var rank = content[i][3]; - ret[pkg] = {"Maintainer": maintainer, "Title": title, "Rank": rank}; + if (openNode != "") { + initiallyOpen = findParents(openNode); + for (var i = 0; i < initiallyOpen.length; i++) { + jQuery("#tree").jstree("open_node", "#" + initiallyOpen[i]); + } } - return(ret); -} - - -var loadPackageData = function() { - if (typeof bioc_packages != "undefined") - jQuery.extend(packageInfo, addToPackageInfo(bioc_packages)); - if (typeof data_annotation_packages != "undefined") - jQuery.extend(packageInfo, addToPackageInfo(data_annotation_packages)); - if (typeof data_experiment_packages != "undefined") - jQuery.extend(packageInfo, addToPackageInfo(data_experiment_packages)); - if (typeof workflow_packages != "undefined") - jQuery.extend(packageInfo, addToPackageInfo(workflow_packages)); -} - + }); + + // This exists because the tree would disappear if the selected + // node was collapsed (only if the selected node was >1 level in + // and matched what was in the url bar). For some reason this fixes it. + jQuery("#tree").bind("close_node.jstree", function (event, data) { + timeoutId = window.setTimeout(onTimeout, 1); + + function onTimeout() { + var vis; + do { + jQuery("#tree").toggle(); + vis = jQuery("#tree").is(":visible"); + } while (vis == false); + } + }); + + jQuery("#tree-toggler").click(function () { + jQuery(".jstree li:not([id])").toggle(); + }); +}; + +var getHostUrl = function () { + var url = window.location.href; + var segs = url.split("/"); + segs.pop(); + url = segs.join("/"); + return url; +}; + +var addToPackageInfo = function (data) { + var ret = {}; + var content = data["content"]; + for (var i = 0; i < content.length; i++) { + var pkg = content[i][0]; + var maintainer = content[i][1]; + var title = content[i][2]; + var rank = content[i][3]; + ret[pkg] = { Maintainer: maintainer, Title: title, Rank: rank }; + } + return ret; +}; + +var loadPackageData = function () { + if (typeof bioc_packages != "undefined") + jQuery.extend(packageInfo, addToPackageInfo(bioc_packages)); + if (typeof data_annotation_packages != "undefined") + jQuery.extend(packageInfo, addToPackageInfo(data_annotation_packages)); + if (typeof data_experiment_packages != "undefined") + jQuery.extend(packageInfo, addToPackageInfo(data_experiment_packages)); + if (typeof workflow_packages != "undefined") + jQuery.extend(packageInfo, addToPackageInfo(workflow_packages)); +}; //document ready function jQuery(function () { - setBiocVersion(); - if (biocVersion == releaseVersion) { - jQuery("#tree-toggler-div").hide(); - } - - //do this in displayPackages instead: - //jQuery(".jstree li:not([id])").hide(); - - loadPackageData(); - init(); - start(); - setupAutoCompleter(); + setBiocVersion(); + if (biocVersion == releaseVersion) { + jQuery("#tree-toggler-div").hide(); + } + + //do this in displayPackages instead: + //jQuery(".jstree li:not([id])").hide(); + + loadPackageData(); + init(); + start(); + setupAutoCompleter(); }); -var setupAutoCompleter = function() -{ - var hash = {}; - var lowerHash = {}; - - function recursiveFunction(key, val) { - if (key=="data") { - if (val.indexOf(" ") > -1) { - var hashkey = val.split(" ")[0]; - hash[hashkey] = val; - lowerHash[hashkey.toLowerCase()] = hashkey; - } - } - if (key=="children") { - for (var i = 0; i < val.length; i++) { - var value = val[i]; - if (value instanceof Object) { - jQuery.each(value, function(key, val) { - recursiveFunction(key, val); - }); - } - } - } +var setupAutoCompleter = function () { + var hash = {}; + var lowerHash = {}; + + function recursiveFunction(key, val) { + if (key == "data") { + if (val.indexOf(" ") > -1) { + var hashkey = val.split(" ")[0]; + hash[hashkey] = val; + lowerHash[hashkey.toLowerCase()] = hashkey; + } } - - for (var i = 0; i < dataTree['data'].length; i++) { - var obj = dataTree['data'][i]; - jQuery.each(obj, function(key, val) {recursiveFunction(key, val)}); + if (key == "children") { + for (var i = 0; i < val.length; i++) { + var value = val[i]; + if (value instanceof Object) { + jQuery.each(value, function (key, val) { + recursiveFunction(key, val); + }); + } + } } + } - var biocViewsNames = Object.keys(hash); - biocViewsNames.sort(); - jQuery("#autocompleter").autocomplete({ - "source": biocViewsNames, - "select": function(event, ui) { - jQuery("#tree").jstree("deselect_all"); - jQuery("#tree").jstree("close_all"); - - var selector = "#" + ui.item.value; - try { - jQuery("#tree").jstree("select_node", jQuery(selector)); - } catch(err) { - } - - nodeSelected(null, hash[ui.item.value]); - - } - }).keypress(function(e){ - if (e.keyCode === 13) { - var value = jQuery("#autocompleter").val().toLowerCase(); - //console.log("value is " + value); - if (Object.keys(lowerHash).indexOf(value) > -1) { - value = lowerHash[value]; - //console.log("now value is " + value); - jQuery("#tree").jstree("deselect_all"); - jQuery("#tree").jstree("close_all"); - var selector = "#" + value; - try { - jQuery("#tree").jstree("select_node", jQuery(selector)); - } catch(err) { - } - var node = hash[value]; - jQuery(".ui-menu-item").hide(); - nodeSelected(null, node); - jQuery("#autocompleter").val(value); - } + for (var i = 0; i < dataTree["data"].length; i++) { + var obj = dataTree["data"][i]; + jQuery.each(obj, function (key, val) { + recursiveFunction(key, val); + }); + } + + var biocViewsNames = Object.keys(hash); + biocViewsNames.sort(); + jQuery("#autocompleter") + .autocomplete({ + source: biocViewsNames, + select: function (event, ui) { + jQuery("#tree").jstree("deselect_all"); + jQuery("#tree").jstree("close_all"); + + var selector = "#" + ui.item.value; + try { + jQuery("#tree").jstree("select_node", jQuery(selector)); + } catch (err) {} + + nodeSelected(null, hash[ui.item.value]); + }, + }) + .keypress(function (e) { + if (e.keyCode === 13) { + var value = jQuery("#autocompleter").val().toLowerCase(); + //console.log("value is " + value); + if (Object.keys(lowerHash).indexOf(value) > -1) { + value = lowerHash[value]; + //console.log("now value is " + value); + jQuery("#tree").jstree("deselect_all"); + jQuery("#tree").jstree("close_all"); + var selector = "#" + value; + try { + jQuery("#tree").jstree("select_node", jQuery(selector)); + } catch (err) {} + var node = hash[value]; + jQuery(".ui-menu-item").hide(); + nodeSelected(null, node); + jQuery("#autocompleter").val(value); } + } }); -} +}; var G = new jsnx.DiGraph(); -var visitNode = function(data, f) { - //debugger; - if ('data' in data) { - var tag = data['data']; - var biocView = tag.split(" ")[0]; - //G.add_node(biocView); - f(data); - //console.log(biocView); - /* +var visitNode = function (data, f) { + //debugger; + if ("data" in data) { + var tag = data["data"]; + var biocView = tag.split(" ")[0]; + //G.add_node(biocView); + f(data); + //console.log(biocView); + /* if (biocView == query) { alert("helo!"); return(data); } */ - for (var i = 0; i < data['children'].length; i++) { - var child = data['children'][i]; - var res = visitNode(child, f); - //if (res != "") return(res); - } - } else { - return ""; - } -} - -var traverseTree = function(f) { - var views = []; - var query = "AssayDomains"; - for (var i =0; i < dataTree['data'].length; i++) { - obj = dataTree['data'][i]; - var res = visitNode(obj, f); - } -} - -var eff = function(data) { - if ('data' in data) { - var tag = data['data']; - var biocView = tag.split(" ")[0]; - G.add_node(biocView); - } -} - - -var eff2 = function(data) { - var biocView; - if ('data' in data) { - var tag = data['data']; - var biocView = tag.split(" ")[0]; - } else { - //console.log("this is unexpected!"); + for (var i = 0; i < data["children"].length; i++) { + var child = data["children"][i]; + var res = visitNode(child, f); + //if (res != "") return(res); } - if ('attr' in data) { - var attr = data['attr']; - if ('packageList' in attr) { - var packageList = attr['packageList']; - var pkgs = packageList.split(","); - G.node.get(biocView).pkgs = pkgs; - } + } else { + return ""; + } +}; + +var traverseTree = function (f) { + var views = []; + var query = "AssayDomains"; + for (var i = 0; i < dataTree["data"].length; i++) { + obj = dataTree["data"][i]; + var res = visitNode(obj, f); + } +}; + +var eff = function (data) { + if ("data" in data) { + var tag = data["data"]; + var biocView = tag.split(" ")[0]; + G.add_node(biocView); + } +}; + +var eff2 = function (data) { + var biocView; + if ("data" in data) { + var tag = data["data"]; + var biocView = tag.split(" ")[0]; + } else { + //console.log("this is unexpected!"); + } + if ("attr" in data) { + var attr = data["attr"]; + if ("packageList" in attr) { + var packageList = attr["packageList"]; + var pkgs = packageList.split(","); + G.node.get(biocView).pkgs = pkgs; } - if ('children' in data) { - for (var i =0; i < data['children'].length; i++) { - var child = data['children'][i]; - if(('attr' in child) && ('id' in child['attr'])) - G.add_edge(biocView, child['attr']['id']); - } + } + if ("children" in data) { + for (var i = 0; i < data["children"].length; i++) { + var child = data["children"][i]; + if ("attr" in child && "id" in child["attr"]) + G.add_edge(biocView, child["attr"]["id"]); } -} + } +}; var bla; var nodes; var nodeIdx = {}; -var getNode = function(name, full) { - var res = nodes[nodeIdx[name]]; - if (full) - return(res) - return(res[0]); -} - -var start = function() -{ - traverseTree(eff); - traverseTree(eff2); - - nodes = G.nodes(true); - - for (var i =0; i < nodes.length; i++) { - - var node = nodes[i]; - var name = node[0]; - nodeIdx[name] = i; - - } - -} - -var rf = function(node) { - var successorList = G.successors(node); - var l = successorList.length; - for (var i = 0; i < l; i++) { - successorList = successorList.concat(rf(getNode(successorList[i]))); - } - return(successorList); -} - -var getAllSuccessors = function(startName) { - var startNode = getNode(startName); - return(rf(startNode)); -} - -getAllPackages = function(startPkg) { - var succ = getAllSuccessors(startPkg); - var node = getNode(startPkg, true)[1]; - var res = {}; - if ('pkgs' in node && node['pkgs'].length > 0) { - for (var i = 0; i < node['pkgs'].length; i++) { - res[node['pkgs'][i]] = 1; - } +var getNode = function (name, full) { + var res = nodes[nodeIdx[name]]; + if (full) return res; + return res[0]; +}; + +var start = function () { + traverseTree(eff); + traverseTree(eff2); + + nodes = G.nodes(true); + + for (var i = 0; i < nodes.length; i++) { + var node = nodes[i]; + var name = node[0]; + nodeIdx[name] = i; + } +}; + +var rf = function (node) { + var successorList = G.successors(node); + var l = successorList.length; + for (var i = 0; i < l; i++) { + successorList = successorList.concat(rf(getNode(successorList[i]))); + } + return successorList; +}; + +var getAllSuccessors = function (startName) { + var startNode = getNode(startName); + return rf(startNode); +}; + +getAllPackages = function (startPkg) { + var succ = getAllSuccessors(startPkg); + var node = getNode(startPkg, true)[1]; + var res = {}; + if ("pkgs" in node && node["pkgs"].length > 0) { + for (var i = 0; i < node["pkgs"].length; i++) { + res[node["pkgs"][i]] = 1; } - for (var i = 0; i < succ.length; i++) { - var item = succ[i]; - var node = getNode(item, true); - var obj = node[1]; - if ('pkgs' in obj) { - for (var j = 0; j < obj['pkgs'].length; j++) { - var pkg = obj['pkgs'][j]; - res[pkg] = 1; - } - } + } + for (var i = 0; i < succ.length; i++) { + var item = succ[i]; + var node = getNode(item, true); + var obj = node[1]; + if ("pkgs" in obj) { + for (var j = 0; j < obj["pkgs"].length; j++) { + var pkg = obj["pkgs"][j]; + res[pkg] = 1; + } } - var keys = Object.keys(res); - //console.log("got " + keys.length + " packages for " + startPkg); - return(keys.sort( - function(a, b) { - if (a.toLowerCase() < b.toLowerCase()) return -1; - if (a.toLowerCase() > b.toLowerCase()) return 1; - return 0; - } - )); - -} + } + var keys = Object.keys(res); + //console.log("got " + keys.length + " packages for " + startPkg); + return keys.sort(function (a, b) { + if (a.toLowerCase() < b.toLowerCase()) return -1; + if (a.toLowerCase() > b.toLowerCase()) return 1; + return 0; + }); +}; diff --git a/assets/js/bioconductor.js b/assets/js/bioconductor.js index c8bb8df0f..6c86338b3 100644 --- a/assets/js/bioconductor.js +++ b/assets/js/bioconductor.js @@ -1,7 +1,6 @@ - // bioconductor.js if (!/\.html$|\/$|#/.test(window.location.href)) - window.location.href = window.location.href + "/"; + window.location.href = window.location.href + "/"; // global variables var checkForEncryptInterval; @@ -12,199 +11,305 @@ var gExp; // logging functions: var fb_lite = false; try { - // if (firebug) { - // fb_lite = true; - // firebug.d.console.cmd.log("initializing firebug logging"); - // } -} catch(e) { - // do nothing + // if (firebug) { + // fb_lite = true; + // firebug.d.console.cmd.log("initializing firebug logging"); + // } +} catch (e) { + // do nothing } +//Sitehead code that will underline the nav element if the page URL matches the element +const nav_elements = [ + /^\/about\//, + /^\/help\//, + /^\/packages\//, + /^\/developers\//, +]; -function log(message) { - if (fb_lite) { - //console.log(message); - } else { - // if (window.console) { - // console.log(message); - // } - } - if (window.dump) { - dump(message + "\n"); - } -} +function checkNav() { + const currentPath = window.location.pathname; + const navLinks = document.querySelectorAll(".nav-links a"); -// convenience functions -String.prototype.trim = function() { - return this.replace(/^\s+|\s+$/g,""); -} -String.prototype.ltrim = function() { - return this.replace(/^\s+/,""); -} -String.prototype.rtrim = function() { - return this.replace(/\s+$/,""); + navLinks.forEach((link, index) => { + if (nav_elements[index].test(currentPath)) { + link.classList.add("active"); + } + }); } -//utility functions -var getParameterByName = function ( name ) { - name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); - var regexS = "[\\?&]"+name+"=([^&#]*)"; - var regex = new RegExp( regexS ); - var results = regex.exec( window.location.href ); - if( results == null ) - return ""; - else - return decodeURIComponent(results[1].replace(/\+/g, " ")); -} +window.addEventListener("load", checkNav); +//Mobile siteHead js +document.addEventListener("DOMContentLoaded", function () { + findHeaderTop(); + const hamburger = document.querySelector(".hamburger"); + const navMenu = document.querySelector(".header-nav"); -// general-use function to add handlers. use like this: -// if(document.getElementById('ehs.form')){ -// addEvent(document.getElementById('ehs.form'), 'click', handleRadioClick); -// } -// JS Bible 6th ed. -function addEvent(elem,evtType,func){ - if(elem.addEventListener){ elem.addEventListener(evtType,func,false); } - else if(elem.attachEvent){ elem.attachEvent("on"+evtType, func); } - else { elem["on"+evtType] = func; } + function mobileMenu() { + hamburger.classList.toggle("active"); + navMenu.classList.toggle("active"); + } + + hamburger.addEventListener("click", mobileMenu); + + const navLink = document.querySelectorAll(".mobile-link"); + + function closeMenu() { + hamburger.classList.remove("active"); + navMenu.classList.remove("active"); + } + + navLink.forEach((n) => n.addEventListener("click", closeMenu)); + + window.addEventListener("resize", findHeaderTop); +}); + +function findHeaderTop() { + const announcementHeight = + document.querySelector(".announcement")?.offsetHeight; + const header = document.querySelector(".site-masthead"); + + if (announcementHeight) { + header.style.top = `-${announcementHeight}px`; + } } +//Changes body and hero background color once clicked on certain links +function changeBackgroundColors() { + const heroElement = document.querySelector(".hero"); + const installPageRegex = /\/install\//; + const aboutPageRegex = /\/about\//; + const packagePageRegex = /\/packages\//; + + if (installPageRegex.test(window.location.href)) { + document.body.style.backgroundColor = "#fff"; + heroElement.style.backgroundColor = "var(--neutral-n50)"; + } else if ( + aboutPageRegex.test(window.location.href) || + packagePageRegex.test(window.location.href) + ) { + document.body.style.backgroundColor = "#fff"; + } +} -// parse the page and pick out div's that have a certain class -// and change those into shaded boxes by adding HTML. this inserts -// table code, but that should be transparent to all users. -function renderShadedBoxes(){ +changeBackgroundColors(); - // prepare the HTML to insert into the divs of target class - var insert1 = '
 '; - var insert2 = ' 
'; +window.addEventListener("hashchange", changeBackgroundColors); - // obtain all the div's of the target class. note that pre-ie7 doesn't return .getAttribute('class') but does return .getAttribute('className') so we check for that specially - var oDivs = document.getElementsByTagName('div'); - var className = ''; - for(var i=0;i-1){ //alert(i); - oDivs.item(i).innerHTML = insert1 + oDivs.item(i).innerHTML + insert2; - oDivs.item(i).className=''; // this removes the shaded_box class from the original div so the styling i just made takes over +//Allow the cursor to drag and scroll the events +function enableDragScroll() { + const slider = document.querySelector(".events-container"); + let isDown = false; + let startX; + let scrollLeft; + + if (slider) { + slider.addEventListener("mousedown", (e) => { + isDown = true; + slider.classList.add("active"); + startX = e.pageX - slider.offsetLeft; + scrollLeft = slider.scrollLeft; + }); + + function handleMouseUpAndLeave() { + isDown = false; + slider.classList.remove("active"); } + + slider.addEventListener("mouseup", handleMouseUpAndLeave); + slider.addEventListener("mouseleave", handleMouseUpAndLeave); + + slider.addEventListener("mousemove", (e) => { + if (!isDown) return; + e.preventDefault(); + const x = e.pageX - slider.offsetLeft; + const scrollSpeed = x - startX; + slider.scrollLeft = scrollLeft - scrollSpeed; + }); } +} + +window.addEventListener("load", enableDragScroll); + +//package page +function wrapChildDivs() { + const parentElement = document.getElementById( + "biocViews_package_table_wrapper" + ); + + const lengthDiv = document.getElementById("biocViews_package_table_length"); + const searchDiv = document.getElementById("biocViews_package_table_filter"); + + const tableInfo = document.getElementById("biocViews_package_table_info"); + const pagePagination = document.getElementById( + "biocViews_package_table_paginate" + ); + const newUpperWrapperDiv = document.createElement("div"); + newUpperWrapperDiv.id = "package-entries-wrapper"; + + const newLowerWrapperDiv = document.createElement("div"); + newLowerWrapperDiv.id = "package-info-wrapper"; + + newUpperWrapperDiv.appendChild(lengthDiv); + newUpperWrapperDiv.appendChild(searchDiv); + + newLowerWrapperDiv.appendChild(tableInfo); + newLowerWrapperDiv.appendChild(pagePagination); + + parentElement.insertBefore(newUpperWrapperDiv, parentElement.firstChild); + + parentElement.appendChild(newLowerWrapperDiv); } -// check each page load to see if there is any shaded_box class -addEvent(window,'load',renderShadedBoxes); - - - -// Masthead site navigation. we have five or more site navigation elements -// appearing at page top, and depending upon the current page url, we want -// the corresponding element to be olive and color unchanged at hover. we do this by pattern matching -// on the page url (client side), and turning the corresponding element olive. -// the position of each of the patterns corresponds to the masthead nav element number, -// e.g., the third element, /help/, which is index 3 (option base 1), matches masthead_nav_element_3 -// we use one Array of matching patterns for each element in case one element needs to match more than one patten. -// examples are shown below, but adjust for your info architecture. -var masthead_nav_elements = Array( Array(/^\/$/, /^\/index\.html$/),Array(/\/install\//, /install\.html/), - Array(/\/help\//),Array(/\/developers\//),Array(/\/about\//) ); -function checkNav(){ - for(var i=0; i 0) { +var tidyWorkflows = function () { + if (jQuery("#workflows").length > 0) { var workflows = []; - jQuery(".workflow").each(function(index) { + jQuery(".workflow").each(function (index) { workflows.push(jQuery(this).html()); }); jQuery("#workflows_left").html(""); jQuery("#workflows_right").html(""); var rands = {}; - while(Object.size(rands) < 4) { - var rand = Math.floor(Math.random()* workflows.length); + while (Object.size(rands) < 4) { + var rand = Math.floor(Math.random() * workflows.length); rands[rand] = -1; } var i = 0; var keys = Object.keys(rands); keys = keys.sort(); for (var key in keys.sort()) { - var id = (i < 2) ? "#workflows_left" : "#workflows_right"; + var id = i < 2 ? "#workflows_left" : "#workflows_right"; html = jQuery(id).html(); jQuery(id).html(html + "
  • " + workflows[parseInt(keys[i])] + "
  • "); i++; } } -} +}; -var unRebaseMirrors = function() { - if (!(window.mirror === undefined) && mirror == true) { - var wlh = window.location.href; - var segs = wlh.split("/"); - var host = wlh.replace(/^http:\/\//i, "").split("/")[0]; - segs.pop(); - var url = segs.join("/"); - if (segs[3] != "packages") { - host += "/" + segs[3]; - } - jQuery.each(jQuery(".do_not_rebase a"), function(index, value){ - var href = jQuery(value).attr("href"); - if (!href.match(/^http:/i)) { - if (href.match(/^\//)) { - jQuery(value).attr("href", "http://" + host + href); - } else if (href.match(/^#/)) { - jQuery(value).attr("href", window.location.href + href); - } else { - jQuery(value).attr("href", url + "/" + href); - } - } - }); +var unRebaseMirrors = function () { + if (!(window.mirror === undefined) && mirror == true) { + var wlh = window.location.href; + var segs = wlh.split("/"); + var host = wlh.replace(/^http:\/\//i, "").split("/")[0]; + segs.pop(); + var url = segs.join("/"); + if (segs[3] != "packages") { + host += "/" + segs[3]; } -} + jQuery.each(jQuery(".do_not_rebase a"), function (index, value) { + var href = jQuery(value).attr("href"); + if (!href.match(/^http:/i)) { + if (href.match(/^\//)) { + jQuery(value).attr("href", "http://" + host + href); + } else if (href.match(/^#/)) { + jQuery(value).attr("href", window.location.href + href); + } else { + jQuery(value).attr("href", url + "/" + href); + } + } + }); + } +}; /* * The little file server we use for development does not follow symlinks, so see if we are running * that server (assume we are if we are not on port 80) and change URLs tagged with the "symlink" * class (e.g. containing "release" or "devel" to point to the actual file. */ -var getHrefForSymlinks = function(href) { +var getHrefForSymlinks = function (href) { if (window.location.port == "") { return href; } else { var releaseRegex = /\/release\//; - var develRegex = /\/devel\//; + var develRegex = /\/devel\//; if (href.match(releaseRegex)) { return href.replace(releaseRegex, "/" + releaseVersion + "/"); } else if (href.match(develRegex)) { @@ -213,115 +318,64 @@ var getHrefForSymlinks = function(href) { return href; } } -} - - -var handleCitations = function() -{ - if (jQuery("#bioc_citation").length ) { - jQuery("#bioc_citation_outer").hide(); - var url = window.location.href; - url = url.replace("html","citations"); - var segs = url.split("/"); - var pkg = segs.pop(); - pkg = pkg.replace(".html", "") - segs.push(pkg); - segs.push("citation.html"); - url = segs.join("/"); - jQuery.ajax({url: url, dataType: "html", - success: function(data,textStatus,jqXHR){ - // working around possible R bug? - data = data.replace(/}. /g, ""); - data = data.replace(/}. 0) { -// jQuery("#initially_hidden").hide(); -// var dnsName = getParameterByName("dns"); -// var key = getParameterByName("key"); -// var url = "http://" + dnsName + ":8787"; -// var action = url + "/auth-do-sign-in"; -// var link = "../launch?username=ubuntu&password=bioc&url=" + url; -// link += "&encrypted="; -// jQuery("#ami_link").attr("href", link); -// jQuery("#instance_url").html(url); - -// var payload, exp, mod; -// payload = "ubuntu\nbioc"; -// var chunks = key.split(':', 2); -// exp = chunks[0]; -// mod = chunks[1]; - -// var encrypted = encrypt(payload, exp, mod); - -// var link = jQuery("#ami_link").attr("href"); -// jQuery("#ami_link").attr("href", link + encrypted); -// jQuery("#instance_loading").html(""); -// jQuery("#initially_hidden").show(); -// } - - -// if (jQuery("#launch_tryitnow").length > 0) { // is this launch.md? -// jQuery("#hide_this_stuff").hide(); -// var username = getParameterByName("username"); -// var password = getParameterByName("password"); -// var encrypted = getParameterByName("encrypted"); -// encrypted = encrypted.replace(/ /g, "+"); -// var url = getParameterByName("url"); -// var action = url + "/auth-do-sign-in"; -// jQuery("form").get(1).setAttribute("action", action); -// document.getElementById("username").value = username; -// document.getElementById("password").value = password; -// //todo change this: -// document.getElementById('persist').value = document.getElementById('staySignedIn').checked ? "1" : "0"; -// document.getElementById('clientPath').value = window.location.pathname; -// document.getElementById('package').value = encrypted; -// document.realform.submit(); -// } - -// if (jQuery("#captcha_js").length > 0) { -// jQuery("#captcha_js").html("") -// } - -// }); - -var submit_tryitnow = function() { - jQuery("#tryitnow_button").attr("disabled", "disabled"); - jQuery("#tryitnow_button").attr("value", "Please wait..."); - return(true); -} +var submit_tryitnow = function () { + jQuery("#tryitnow_button").attr("disabled", "disabled"); + jQuery("#tryitnow_button").attr("value", "Please wait..."); + return true; +}; -var processCaptchaResults = function(factoryFilename, captchaKey) { - var s = "http://cloud.bioconductor.org:2112/cgi-bin/display_captcha.jpg?factoryFilename="; - s += factoryFilename; - s += "&captchaKey="; - s += captchaKey; - jQuery("#captcha_img").attr("src", s); - jQuery("#captchaKey").attr("value", captchaKey); - jQuery("#factoryFilename").attr("value", factoryFilename); -} +var processCaptchaResults = function (factoryFilename, captchaKey) { + var s = + "http://cloud.bioconductor.org:2112/cgi-bin/display_captcha.jpg?factoryFilename="; + s += factoryFilename; + s += "&captchaKey="; + s += captchaKey; + jQuery("#captcha_img").attr("src", s); + jQuery("#captchaKey").attr("value", captchaKey); + jQuery("#factoryFilename").attr("value", factoryFilename); +}; diff --git a/assets/js/code_blocks.js b/assets/js/code_blocks.js new file mode 100644 index 000000000..e59847f4c --- /dev/null +++ b/assets/js/code_blocks.js @@ -0,0 +1,7 @@ +document.addEventListener("DOMContentLoaded", () => { + Array.from(document.getElementsByTagName("code")).forEach((block) => { + block.innerHTML = block.innerHTML.trim(); + }); + + window.hljs.highlightAll(); +}); diff --git a/assets/js/search.js b/assets/js/search.js index c6a2ffbb4..967c23fab 100644 --- a/assets/js/search.js +++ b/assets/js/search.js @@ -99,15 +99,15 @@ var ajaxErrHandler = function(jqXHR, textStatus, errorThrown) { }; var initSearch = function() { - q = getParameterByName("q"); + q = getParameterByName("search-bar"); q = q.replace(/\/$/, ""); if (q == "") { - jQuery("#q").focus(); + jQuery("#search-bar").focus(); } else { $("#search_results").html("Searching...."); - jQuery("#q").val(q); + jQuery("#search-bar").val(q); } jQuery("#if_search_results_present").hide(); diff --git a/assets/js/sidebar.js b/assets/js/sidebar.js new file mode 100644 index 000000000..839881f5b --- /dev/null +++ b/assets/js/sidebar.js @@ -0,0 +1,97 @@ +const addedTopBounding = 80; +const headerOffSetToAdd = 7; +let headerHeight; +document.addEventListener("DOMContentLoaded", function () { + const header = document.querySelector(".header-size"); + headerHeight = header.offsetHeight + headerOffSetToAdd; + + if (document.location.hash) { + const target = document.querySelector(document.location.hash); + let offsetTop; + window.innerWidth < 768 + ? (offsetTop = target.offsetTop + headerHeight) + : (offsetTop = target.offsetTop - headerHeight); + window.scrollTo({ + top: offsetTop, + behavior: "smooth", + }); + } + copySidebar(); + addTopMobileNav(); + const sidebarToggle = document.querySelector(".sidebar-nav"); + const sidebarContentLinks = document.querySelectorAll(".internal-nav a"); + const headings = document.querySelectorAll("h1, h2, h3, h4, h5, h6"); + + sidebarToggle?.addEventListener("click", () => { + toggleNavMenu(sidebarToggle); + }); + + sidebarContentLinks.forEach((link) => { + link.addEventListener("click", function (event) { + event.preventDefault(); + + const target = document.querySelector(this.getAttribute("href")); + if (target) { + let offsetTop; + window.innerWidth < 768 + ? (offsetTop = target.offsetTop + headerHeight) + : (offsetTop = target.offsetTop - headerHeight); + window.scrollTo({ + top: offsetTop, + behavior: "smooth", + }); + } + }); + }); + + window.addEventListener("scroll", () => { + setCurrentHeading(sidebarContentLinks, findCurrentHeadingId(headings)); + }); +}); + +function findCurrentHeadingId(headings) { + for (const heading of headings) { + const bounding = heading.getBoundingClientRect(); + if (heading.id) { + if ( + bounding.top >= addedTopBounding && + bounding.bottom <= window.innerHeight + ) { + return heading.id; + } + } + } +} + +function setCurrentHeading(sidebarContentlinks, activeHeading) { + sidebarContentlinks.forEach((link) => { + const linkHeading = link.getAttribute("href").slice(1); + activeHeading === linkHeading + ? link.classList.add("selected-nav") + : link.classList.remove("selected-nav"); + }); +} + +function toggleNavMenu(sidebarContent) { + sidebarContent.classList.contains("open") + ? sidebarContent.classList.remove("open") + : sidebarContent.classList.add("open"); +} + +function copySidebar() { + const header = document.querySelector("header"); + const sidebarContainer = document.querySelector(".sidebar-nav-container"); + + if (sidebarContainer) { + const sidebarCopy = sidebarContainer.cloneNode(true); + sidebarCopy.id = "header-sidebar-container"; + + header.appendChild(sidebarCopy); + } +} + +function addTopMobileNav() { + const sideBarNav = document.querySelector("#header-sidebar-container"); + const headerNav = document.querySelector(".header-nav"); + sideBarNav ? (headerNav.style.top = "60%") : (headerNav.style.top = "100%"); +} diff --git a/assets/js/tree-widget/themes/apple/style.css b/assets/js/tree-widget/themes/apple/style.css index db7a143e0..092653ca1 100755 --- a/assets/js/tree-widget/themes/apple/style.css +++ b/assets/js/tree-widget/themes/apple/style.css @@ -4,58 +4,220 @@ * Supported plugins: ui (hovered, clicked), checkbox, contextmenu, search */ -.jstree-apple > ul { background:url("bg.jpg") left top repeat; } -.jstree-apple li, -.jstree-apple ins { background-image:url("d.png"); background-repeat:no-repeat; background-color:transparent; } -.jstree-apple li { background-position:-90px 0; background-repeat:repeat-y; } -.jstree-apple li.jstree-last { background:transparent; } -.jstree-apple .jstree-open > ins { background-position:-72px 0; } -.jstree-apple .jstree-closed > ins { background-position:-54px 0; } -.jstree-apple .jstree-leaf > ins { background-position:-36px 0; } - -.jstree-apple a { border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; text-shadow:1px 1px 1px white; } -.jstree-apple .jstree-hovered { background:#e7f4f9; border:1px solid #d8f0fa; padding:0 3px 0 1px; text-shadow:1px 1px 1px silver; } -.jstree-apple .jstree-clicked { background:#beebff; border:1px solid #99defd; padding:0 3px 0 1px; } -.jstree-apple a .jstree-icon { background-position:-56px -20px; } -.jstree-apple a.jstree-loading .jstree-icon { background:url("throbber.gif") center center no-repeat !important; } - -.jstree-apple.jstree-focused { background:white; } - -.jstree-apple .jstree-no-dots li, -.jstree-apple .jstree-no-dots .jstree-leaf > ins { background:transparent; } -.jstree-apple .jstree-no-dots .jstree-open > ins { background-position:-18px 0; } -.jstree-apple .jstree-no-dots .jstree-closed > ins { background-position:0 0; } - -.jstree-apple .jstree-no-icons a .jstree-icon { display:none; } - -.jstree-apple .jstree-search { font-style:italic; } - -.jstree-apple .jstree-no-icons .jstree-checkbox { display:inline-block; } -.jstree-apple .jstree-no-checkboxes .jstree-checkbox { display:none !important; } -.jstree-apple .jstree-checked > a > .jstree-checkbox { background-position:-38px -19px; } -.jstree-apple .jstree-unchecked > a > .jstree-checkbox { background-position:-2px -19px; } -.jstree-apple .jstree-undetermined > a > .jstree-checkbox { background-position:-20px -19px; } -.jstree-apple .jstree-checked > a > .checkbox:hover { background-position:-38px -37px; } -.jstree-apple .jstree-unchecked > a > .jstree-checkbox:hover { background-position:-2px -37px; } -.jstree-apple .jstree-undetermined > a > .jstree-checkbox:hover { background-position:-20px -37px; } - -#vakata-dragged.jstree-apple ins { background:transparent !important; } -#vakata-dragged.jstree-apple .jstree-ok { background:url("d.png") -2px -53px no-repeat !important; } -#vakata-dragged.jstree-apple .jstree-invalid { background:url("d.png") -18px -53px no-repeat !important; } -#jstree-marker.jstree-apple { background:url("d.png") -41px -57px no-repeat !important; text-indent:-100px; } - -.jstree-apple a.jstree-search { color:aqua; } -.jstree-apple .jstree-locked a { color:silver; cursor:default; } - -#vakata-contextmenu.jstree-apple-context, -#vakata-contextmenu.jstree-apple-context li ul { background:#f0f0f0; border:1px solid #979797; -moz-box-shadow: 1px 1px 2px #999; -webkit-box-shadow: 1px 1px 2px #999; box-shadow: 1px 1px 2px #999; } -#vakata-contextmenu.jstree-apple-context li { } -#vakata-contextmenu.jstree-apple-context a { color:black; } -#vakata-contextmenu.jstree-apple-context a:hover, -#vakata-contextmenu.jstree-apple-context .vakata-hover > a { padding:0 5px; background:#e8eff7; border:1px solid #aecff7; color:black; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } -#vakata-contextmenu.jstree-apple-context li.jstree-contextmenu-disabled a, -#vakata-contextmenu.jstree-apple-context li.jstree-contextmenu-disabled a:hover { color:silver; background:transparent; border:0; padding:1px 4px; } -#vakata-contextmenu.jstree-apple-context li.vakata-separator { background:white; border-top:1px solid #e0e0e0; margin:0; } -#vakata-contextmenu.jstree-apple-context li ul { margin-left:-4px; } - -/* TODO: IE6 support - the `>` selectors */ \ No newline at end of file +/* stylelint-disable property-no-vendor-prefix */ + +.jstree-apple > ul { + background: none; + padding: 0.5rem; + padding-left: 0; +} + +.jstree-apple li::marker { + content: none; +} + +.jstree-apple li, +.jstree-apple ins { + background-image: url("d.png"); + background-repeat: no-repeat; + background-color: transparent; + margin-right: 0.3rem; +} + +.jstree-apple li { + background-position: -90px 0; + background-repeat: repeat-y; +} + +.jstree-apple li.jstree-last { + background: transparent; +} + +.jstree-apple .jstree-open > ins { + background-position: -72px 0; +} + +.jstree-open > ul > li > ul > li > ins { + display: none; +} + +.jstree-open > ul > li > ul > li > a { + margin-left: 1rem; +} + +#ShinyApps > ins, +#WorkflowManagement > ins, +#CustomArray > ins, +#FunctionalAnnotation > ins, +#ReproducibleResearch > ins, +#Workflow > ul > li > ins { + display: none; +} + +#ShinyApps > a, +#WorkflowManagement > a, +#CustomArray > a, +#FunctionalAnnotation > a, +#ReproducibleResearch > a { + margin-left: 2rem; +} + +#Workflow > ul > li > a { + margin-left: 1rem; +} + +.jstree-apple .jstree-closed > ins { + background-position: -54px 0; +} + +.jstree-apple .jstree-leaf > ins { + background-position: -36px 0; +} + +.jstree-apple .jstree-clicked { + background: var(--gradient-purpleblue); + color: #fff; + height: 1rem; + padding: 0.5rem; + border-radius: 0.25rem; + font-weight: 700; +} + +.jstree-apple a .jstree-icon { + background-position: -56px -20px; +} + +.jstree-apple a.jstree-loading .jstree-icon { + background: url("throbber.gif") center center no-repeat !important; +} + +.jstree-apple.jstree-focused { + background: white; +} + +.jstree-apple .jstree-no-dots li, +.jstree-apple .jstree-no-dots .jstree-leaf > ins { + padding: 0.5rem; + margin: 0.5rem; + background: transparent; +} + +.jstree-apple .jstree-no-dots .jstree-open > ins { + background-position: -18px 0; +} + +.jstree-apple .jstree-no-dots .jstree-closed > ins { + background-position: 0 0; +} + +.jstree-apple .jstree-no-icons a .jstree-icon { + display: none; +} + +.jstree-apple .jstree-search { + font-style: italic; +} + +.jstree-apple .jstree-no-icons .jstree-checkbox { + display: inline-block; +} + +.jstree-apple .jstree-no-checkboxes .jstree-checkbox { + display: none !important; +} + +.jstree-apple .jstree-checked > a > .jstree-checkbox { + background-position: -38px -19px; +} + +.jstree-apple .jstree-unchecked > a > .jstree-checkbox { + background-position: -2px -19px; +} + +.jstree-apple .jstree-undetermined > a > .jstree-checkbox { + background-position: -20px -19px; +} + +.jstree-apple .jstree-checked > a > .checkbox:hover { + background-position: -38px -37px; +} + +.jstree-apple .jstree-unchecked > a > .jstree-checkbox:hover { + background-position: -2px -37px; +} + +.jstree-apple .jstree-undetermined > a > .jstree-checkbox:hover { + background-position: -20px -37px; +} + +#vakata-dragged.jstree-apple ins { + background: transparent !important; +} + +#vakata-dragged.jstree-apple .jstree-ok { + background: url("d.png") -2px -53px no-repeat !important; +} + +#vakata-dragged.jstree-apple .jstree-invalid { + background: url("d.png") -18px -53px no-repeat !important; +} + +#jstree-marker.jstree-apple { + background: url("d.png") -41px -57px no-repeat !important; + text-indent: -100px; +} + +.jstree-apple a.jstree-search { + color: aqua; +} + +.jstree-apple .jstree-locked a { + color: silver; + cursor: default; +} + +#vakata-contextmenu.jstree-apple-context, +#vakata-contextmenu.jstree-apple-context li ul { + background: #f0f0f0; + border: 1px solid #979797; + -moz-box-shadow: 1px 1px 2px #999; + -webkit-box-shadow: 1px 1px 2px #999; + box-shadow: 1px 1px 2px #999; +} + +#vakata-contextmenu.jstree-apple-context a { + color: black; +} + +#vakata-contextmenu.jstree-apple-context a:hover, +#vakata-contextmenu.jstree-apple-context .vakata-hover > a { + padding: 0 5px; + background: #e8eff7; + border: 1px solid #aecff7; + color: black; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + border-radius: 2px; +} + +#vakata-contextmenu.jstree-apple-context li.jstree-contextmenu-disabled a, +#vakata-contextmenu.jstree-apple-context + li.jstree-contextmenu-disabled + a:hover { + color: silver; + background: transparent; + border: 0; + padding: 1px 4px; +} + +#vakata-contextmenu.jstree-apple-context li.vakata-separator { + background: white; + border-top: 1px solid #e0e0e0; + margin: 0; +} + +#vakata-contextmenu.jstree-apple-context li ul { + margin-left: -4px; +} + +/* TODO: IE6 support - the `>` selectors */ diff --git a/assets/style/base/colors.css b/assets/style/base/colors.css new file mode 100644 index 000000000..829b76e8d --- /dev/null +++ b/assets/style/base/colors.css @@ -0,0 +1,76 @@ +/* Css global color variables */ + +/* You can use `var(--variable-name)` to get the value. */ + +:root { + /* primary colors */ + --primary-p50: #ebf4f7; + --primary-p75: #add2dd; + --primary-p100: #8bc0cf; + --primary-p200: #59a5bb; + --primary: #3792ad; + --primary-p400: #035771; + --primary-p500: #003242; + --default-body: #070707; + + /* secondary colors */ + --secondary-s50: #f3fae9; + --secondary-s75: #cfe9a6; + --secondary-s100: #bbe081; + --secondary-s200: #9ed34a; + --secondary: #8aca25; + --secondary-s400: #618d1a; + --secondary-s500: #547b17; + + /* warning colors */ + --warning-w50: #fef9eb; + --warning-w75: #f9e8ad; + --warning-w100: #f7df8a; + --warning-w200: #f3d158; + --warning: #f1c736; + --warning-w400: #a98b26; + --warning-w500: #937921; + + /* error colors */ + --error-e50: #feebeb; + --error-e75: #f9adad; + --error-e100: #f78a8a; + --error-e200: #f35858; + --error: #f13636; + --error-e400: #f13636; + --error-e500: #932121; + + /* neutral colors */ + --neutral-n50: #f9f9f9; + --neutral-n75: #e7e8ea; + --neutral-n100: #a1a6b3; + --neutral-n200: #797f92; + --neutral: #5d657c; + --neutral-n400: #414757; + --neutral-n500: #393e4c; + + /* Miscellaneous colors */ + --misc-positive: #008a00; + --misc-neutral: #007a9f; + --misc-warning: #ffc600; + --misc-annotations: #ff8a00; + --misc-error: #a92626; + --misc-dark: #070707; + --misc-purple: #a333f1; + --misc-pink: #ce3c7d; + + /* Gradients */ + --gradient-warmcool: linear-gradient(to right, #ff2f4b, #4e5cff); + --gradient-reversewarmcool: linear-gradient(to right, #4e5cff, #ff2f4b); + --gradient-brand: linear-gradient(to right, #0087af, #0484a9, #18a603); + --gradient-brandreverse: linear-gradient(to right, #18a603, #0484a9, #0087af); + --gradient-purpleblue: linear-gradient(to right, #445cf3, #a333f1); + + /* Code blocks */ + --code-blocks-dark: #3d4049; + --code-dark-string: #f1c736; + --code-light-string: #800; + --code-light-literal: #008a00; + --code-dark-literal: #13cd13; + --code-dark-operator: #ff8a8a; +} diff --git a/assets/style/base/fonts.css b/assets/style/base/fonts.css new file mode 100644 index 000000000..5f738db64 --- /dev/null +++ b/assets/style/base/fonts.css @@ -0,0 +1,20 @@ +/* global styles defined at the topmost level. + these can be overridden by subsequent selectors. */ + +/* Downloaded the font format */ +@font-face { + font-family: "Atkinson Hyperlegible"; + src: url("../fonts/AtkinsonHyperlegible-Regular.woff") format("woff"); + src: url("../fonts/AtkinsonHyperlegible-Regular.ttf") format("truetype"); +} + +@font-face { + font-family: "Atkinson Hyperlegible"; + src: url("../fonts/AtkinsonHyperlegible-Bold.woff") format("woff"); + src: url("../fonts/AtkinsonHyperlegible-Bold.ttf") format("truetype"); + font-weight: bold; +} + +* { + font-family: "Atkinson Hyperlegible", sans-serif; +} diff --git a/assets/style/base/layout.css b/assets/style/base/layout.css new file mode 100644 index 000000000..16ebfa33c --- /dev/null +++ b/assets/style/base/layout.css @@ -0,0 +1,62 @@ +body { + margin: 0; + color: var(--default-body); + background: var(--neutral-n50); +} + +.container { + margin: 0 auto; + width: calc(100% - 3rem); + max-width: 1400px; +} + +main > .container { + margin-top: 2rem; +} + +main > .container.main-subnav { + display: grid; + gap: 2rem; + grid-template-columns: 300px 1fr; + grid-template-areas: "left-col ."; +} + +main > .container.main-subnav :is(h1, h2, h3, h4, h5, h6) { + padding-top: 0.5rem; +} + +.content { + white-space: normal; + word-wrap: break-word; + box-sizing: border-box; + overflow: hidden; +} + +img { + max-width: 100%; +} + +@media (max-device-width: 768px), (width <= 768px) { + main > .container.main-subnav { + display: flex; + flex-direction: column-reverse; + margin-right: auto; + margin-left: auto; + } + + main > .container.main-subnav > .content { + position: relative; + } +} + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border-width: 0; +} diff --git a/assets/style/base/typography.css b/assets/style/base/typography.css new file mode 100644 index 000000000..beed2b2fc --- /dev/null +++ b/assets/style/base/typography.css @@ -0,0 +1,135 @@ +/* CSS global styles */ +h1, +h2, +h3, +h4, +h5, +h6, +.text-h1, +.text-h2, +.text-h3, +.text-h4, +.text-h5, +.text-h6 { + line-height: 120%; + margin: 0 0 1rem; + width: fit-content; +} + +h1, +.text-h1 { + font-size: 2.25rem; + border-image: var(--gradient-brandreverse) 1; + border-bottom-style: solid; + border-bottom-width: 4px; + display: inline-block; +} + +h2, +.text-h2 { + font-size: 2rem; +} + +h3, +.text-h3 { + font-size: 1.6rem; +} + +h4, +.text-h4 { + font-size: 1.5rem; +} + +h5, +.text-h5 { + font-size: 1.4rem; +} + +h6, +.text-h6 { + font-size: 1.2rem; +} + +.text-hero { + font-size: 5rem; + line-height: 105%; + border: none; +} + +a { + color: black; +} + +@media (max-device-width: 768px),(width <= 768px){ + h1, + .text-h1 { + font-size: 2.1rem; + } + + h2, + .text-h2 { + font-size: 1.5rem; + } + + h3, + .text-h3 { + font-size: 1.4rem; + } + + h4, + .text-h4 { + font-size: 1.25rem; + } + + h5, + .text-h5 { + font-size: 1.125rem; + } + + h6, + .text-h6 { + font-size: 1.1rem; + } + + .text-hero { + font-size: 2.5rem; + } +} + + +p { + margin: 0 0 1rem; + font-size: 1rem; + line-height: 130%; +} + +.format-bold { + font-weight: bold; +} + +.format-boldunderline { + text-decoration: underline; + font-weight: bold; +} + +.format-underline { + text-decoration: underline; +} + +.text-xsmall { + font-size: 0.6rem; + line-height: 120%; +} + +.text-small { + font-size: 0.8rem; + line-height: 120%; +} + +.text-large { + font-size: 1.25rem; +} + +.text-underline { + text-decoration: underline; +} diff --git a/assets/style/bioconductor.css b/assets/style/bioconductor.css deleted file mode 100755 index 8e4d44e23..000000000 --- a/assets/style/bioconductor.css +++ /dev/null @@ -1,685 +0,0 @@ -/* css global styles for bioconductor */ - -/* looks like sass stylesheet is not used */ - -/* global styles defined at the topmost level. - these will be overridden by subsequent selectors. */ - -/* reset the margins and padding of all elements so we can - specify them ourselves */ -body,h1,h2,h3,h4,h5,h6,p,div,span { margin:0; padding:0; border:0; } - -/* some general treatments up top */ -body { - margin:0; padding:0; - background-color: #333333; - background-image: url(../images/site_bg.jpg); - background-position: top center; - background-repeat: no-repeat; -} -h1 { - font-size: 250%; - margin-bottom:1em; - font-weight:normal; - color:#87b13f; - line-height:1.1em; -} /* use margin, not padding, due to the fader effect which uses padding */ -h2 { - font-size: 160%; - margin-bottom:1em; - margin-top:1em; - font-weight:normal; - line-height:1.1em; -} -h3 { - font-size:130%; - margin-bottom:1em; - margin-top:1em; - font-weight:bold; -} -h4,h5,h6 { - font-size:115%; - margin-bottom:1em; - margin-top:1em; - font-weight:bold; -} /* not expecting to dive deeper than four levels on a single page */ -h1,h2,h3,h4,h5,h6 { font-family:Helvetica,Arial,Verdana,Sans-serif; } -/* we use a little padding below the h1 and h2 tags to get the 8px fading - effect, which grows the entire width available to the element */ -h1,h2 { - padding-bottom: 8px; - background-image: url(../images/hx_fader.gif); - background-repeat:repeat-x; - background-position:bottom left; -} -/* multiple lines (breaking text) won't work nicely with icons, but they - are only used at top-level pages with short text */ -h1 img, h2 img { padding-right:12px; vertical-align:middle; } - -p, table { padding-bottom: 1em; } /* makes a nice separation between paragraphs */ - -.olive { color:#87b13f; } /* anything can be colored olive */ -.blue { color:#1a81c2; } /* anything can be colored blue (light blue) */ - -code { color:#87b13f; font-family: 'Lucida Console',monaco,monospace; } - -/* SiteContainer is the single div containing every other element in the site. - it floats center, with no vertical margins, and provides the overall - width of the site. we provide both an id and a class name in order - to allow more flexible cascading: id rules are highly ranked while - class names play nicer with other rules. */ -#SiteContainer { - margin:0 auto; /* floats the design center */ - width:960px; /* change the site design width here */ - position:relative; - /*border:2px black solid;*/ -} -.SiteContainer { - background-color: #ffffff; -} - - -/* SiteMasthead contains the topmost logo and sitenav elements */ -#SiteMasthead { - height: 126px; - white-space:nowrap; - position:absolute; - top:0; - left:0; - width:960px; - /*border:1px green solid;*/ -} -.SiteMasthead { - font-family:Verdana,Arial,Helvetica,Sans-serif; - font-size:70%; - border-bottom: 1px #c9c5c5 solid; -} -.SiteMastheadRight { - position:relative; - z-index:1; - height:125px; - width:600px; - padding-right:48px; - float:right; - background-color:#0092ac; -} -.SiteMastheadRightBackground { - position:relative; - z-index:2; - height:100%; - width:100%; - background-image:url(../images/masthead_nav_fade.gif); - background-position: top left; - background-repeat: repeat; -} -.site_search { - position:relative; - z-index:3; - height:52px; - width:240px; - margin-top:20px; - padding:0; - float:right; - text-align:center; - color:#ffffff; -} -ul.masthead_nav { - position:relative; - z-index:3; - height:53px; - width:600px; - margin:0; - padding:0; - float:right; - list-style-type:none; -} /* positioning in order to play nicely with the black vanity bar above - the site logo (see logo_vanity_bar) */ -li.masthead_nav_element { - float:left; - height:53px; - text-align:center; -} /* note that padding-top + height = 53px, the height of the - ul.masthead_nav. */ -li.masthead_nav_element a { - font-size:130%; - color:#ffffff; - text-decoration:none; - font-weight:bold; - } -li.masthead_nav_element a:hover { color:#c4d931; } -li.masthead_nav_element_selected a { color:#c4d931; } -/* used in the navigation auto-select. see global js file, checkNav(). */ - - -.masthead_logo { border:0; padding: 24px 0 0 30px; float:left; } -.logo_vanity_bar { - position:absolute; - top:0; - left:0; - width:320px; - background-color:black; - height:1px; - z-index:1; -} /* plays a bit with positioning and z-index in order to ride - under the nav also w/in this element */ -/* each masthead nav element is listed here from left to right, - so you can adjust the width of each (if necessary). total - width all all elements should not exceed 648px */ -#masthead_nav_element_1 { width:120px; } -#masthead_nav_element_2 { width:120px; } -#masthead_nav_element_3 { width:120px; } -#masthead_nav_element_4 { width:120px; } -#masthead_nav_element_5 { width:120px; } - - -/* PageContent is the main content on the page */ -#PageContent { padding:140px 20px 0 20px; /*border:1px red solid;*/ } -.PageContent { - font-family:Verdana,Arial,Helvetica,Sans-serif; - font-size:70%; - line-height:1.3em; -} -/* when there is a right rail, apply these styles: */ -/* width is 64% or 600px with a right rail. adjust in concert - with width of RightRail. */ -div#PageContent.WithRightRail { float:left; width:600px; } -/* links are simply blue, hovering slightly less blue */ -.PageContent a { color:#1a81c2; } -.PageContent a:visited { color:#1a81c2; } -.PageContent a:hover { color:#4c94c2; } - - /* ul lists in main content area are generally pleasing */ -.PageContent ul { - list-style-type:none; - margin:0; - margin-bottom:1em; - padding:0; -} -.PageContent ul li { - background-image:url(../images/list_bullet_bare.gif); - background-position:0 .5em; - background-repeat:no-repeat; - padding-left:12px; -} - - -/* PageBreadcrumbs contains the page's breadcrumb trail. it lives - nested within PageContent in order to flow correctly when - breadcrumbs wrap to a second line. we use a background image - in order to create the little arrows between elements. */ -#PageBreadcrumbs { padding:0 0 2em 0; /*border:1px orange solid;*/ } -.PageBreadcrumbs { - font-family:Helvetica,Arial,Verdana,Sans-serif; - font-size:110%; -} -.PageBreadcrumbs ul { list-style-type:none; margin:0; padding:0; } -.PageBreadcrumbs ul li { - display:inline; - padding-left:.3em; - background-image:none; -} -.PageBreadcrumbs a, .PageBreadcrumbs a:visited { - color:#000000; - padding-right:1em; - background-image: url(../images/breadcrumb_arrow.gif); - background-position:center right; - background-repeat:no-repeat; -} -.PageBreadcrumbs a:hover { color:#888888; } - - -/* PageInternalLinksMenu contains any links to intra-page anchors - (i.e., jumps down this page) */ -.PageInternalLinksMenu ul { - margin-left:.3em; - padding-left:.3em; - list-style-image:none; -} -.PageInternalLinksMenu ul li { - display:inline; - padding-left:8px; - padding-right:1em; - background-image: url(../images/list_bullet.gif); - background-repeat:no-repeat; - background-position:left 5px; -} -.PageInternalLinksMenu ul li a { white-space:nowrap; } - - -/* RightRail is the right-hand column on some pages. it is a sibling - to PageContent. when used, you must add WithRightRail class to the - PageContent div in order to save space for RightRail. */ -#RightRail { - /* width is 280px or 27%. adjust in concert with width of - PageContent.WithRightRail */ - width:280px; - padding:140px 20px 0 10px; - float:right; - background-image:url(../images/rightrail_fade.jpg); - background-position:top left; - background-repeat:no-repeat; - /* fade ends at just under 560px, so make column at least that high - to avoid an edge */ - min-height:560px; - /*border:1px purple solid;*/ -} -.RightRail { - font-family:Verdana,Arial,Helvetica,Sans-serif; - font-size:70%; - line-height:1.3em; -} /* line-height matches that of .PageContent */ -.RightRail a { color:#1a81c2; } -.RightRail a:visited { color:#1a81c2; } -.RightRail a:hover { color:#4c94c2; } -p.rightrail_header { - font-size:130%; - color:#87b13f; - font-weight:bold; - padding:0; - margin-bottom:1em; -} - -/* ul lists in right rail are generally pleasing using the - background-image trick */ -.RightRail ul { - list-style-type:none; - padding:0; - margin-top:0em; - margin-bottom:1em; -} -.RightRail ul li { - background-image:url(../images/list_bullet_bare.gif); - background-position:0 .5em; - background-repeat:no-repeat; - padding-left:12px; -} - - -/* "interior" navigation menu, usually within the RightRail, - a simple ul-listing */ -ul.section_nav { list-style-type:none; margin:0; padding:0; padding-left:1em; } -ul.section_nav li { - padding-bottom:1em; - font-size:120%; - background-image:url(../images/list_bullet_bare.gif); - background-position:0 .5em; - background-repeat:no-repeat; - padding-left:12px; -} - - -/* SiteGlobalFooter is the olive box at page bottom which - contains global site navigation elements, copyright and logos */ -#SiteGlobalFooter { - background-color: #345208; /* matches fade at bottom edge */ - padding: 24px; - margin-top:30px; - background-image: url(../images/global_footer_fade.gif); - background-position: top left; - background-repeat: repeat-x; - clear:both; - /* in case the right hand column and page body above me get squirrely */ -} -.SiteGlobalFooter { - color: #ffffff; - font-family:Verdana,Arial,Helvetica,Sans-serif; - font-size:70%; -} -/* slightly tighter spacing in the footer */ -.SiteGlobalFooter p { padding-bottom:.4em } -.SiteGlobalFooter a { color:#ffffff; text-decoration:none; } -.SiteGlobalFooter a:hover { text-decoration:underline; } -.SiteGlobalFooter ul { list-style-type:none; } - -ul.footer_nav_list { - margin:0; - line-height:1.2; - margin-left:0; - margin-top: 18px; - padding-left:0; -} -/* the five main nav elements, not their contents */ -li.footer_nav_list_element { float:left; } -/* boosts intra-element spacing */ -.footer_nav_list_element li { padding-bottom:.5em; } -/* each footer nav element is listed here from left to right, - so you can adjust the width of each (if necessary). total - width all all elements should not exceed 912px = the design - width of 960px - 2 x 24px padding */ -.footer_nav_list_element_0 { width:50px; } -.footer_nav_list_element_1 { width:220px; } -.footer_nav_list_element_2 { width:220px; } -.footer_nav_list_element_3 { width:200px; } -.footer_nav_list_element_4 { width:220px; } - - -/* little logos for fhcrc and bioconductor link back to their respective - locations */ -.global_footer_logo_bc { float:right; padding-left:70px; padding-right:30px; } -.global_footer_logo_bc img { border:0; width:154px; height:51px; } -.global_footer_logo_fhcrc { float:right; } -.global_footer_logo_fhcrc img { border:0; width:154px; height:51px; } - -/* copyright and attribution portion of the global footer */ -.attribution_copyright { padding-bottom:30px; border-bottom:1px #a8bf7c solid; } - - -/* here is the styling for shaded boxes. the content author should NOT - use these classes directly... instead, create a div as follows: - -
    - content here -
    - - when the page loads, JS will check for all div's of class shaded_box - and perform the correct HTML munging to create the shading effect. - - because we use a table structure to get the effect, you'll see classes - sb1 (top-left) through sb9 (bottom-right), reading left-to-right, then - top-to-bottom. box sb5, center-center, contains actual content. - */ -.shaded_box { - border:1px #d8dcdd solid; - padding: 16px; - margin:8px; - background-color:#ffffff; -} /* will be removed after processing the shaded_box div */ -.shaded_box .box_header { font-size:130%; font-weight:bold; } -.shaded_box .box_header a, -.shaded_box .box_header a:visited { color:#000000; text-decoration:none; } -.shaded_box .box_header a:hover { color:#87b13f; text-decoration:underline; } - -.sb { width:100%; height:100%; } -.sb .sb1 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/tl.png); - background-position:bottom right; - background-repeat:no-repeat; -} -.sb .sb2 { - height:8px; - padding:0px; - background-image: url(../images/shadedbox/top.png); - background-position:bottom left; - background-repeat:repeat-x; -} -.sb .sb3 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/tr.png); - background-position:bottom left; - background-repeat:no-repeat; -} -.sb .sb4 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/left.png); - background-position:top right; - background-repeat:repeat-y; -} -.sb .sb5 { - padding:16px; - border:1px #d8dcdd solid; - vertical-align:top; - background-color:#ffffff; -} -.sb .sb6 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/right.png); - background-position:top left; - background-repeat:repeat-y; -} -.sb .sb7 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/bl.png); - background-position:top right; - background-repeat:no-repeat; -} -.sb .sb8 { - height:8px; - padding:0px; - background-image: url(../images/shadedbox/bottom.png); - background-position:top left; - background-repeat:repeat-x; -} -.sb .sb9 { - width:8px; - height:8px; - padding:0px; - background-image: url(../images/shadedbox/br.png); - background-position:top left; - background-repeat:no-repeat; -} - -/* sb-style boxes can have special styles within them */ -.sb .box_header { font-size:130%; } -.sb .box_header a, -.sb .box_header a:visited { color:#000000; text-decoration:none; } -.sb .box_header a:hover { color:#87b13f; text-decoration:underline; } - - -/* here is the styling for code boxes. grey background, code (tt) font, - and overflow is scroll so long lines don't push the main content area - too far out and destroying the design. - - use like this: - -

    - text here -

    - - */ -.code_box { - background-color: #e3e3e3; - padding:1em; - border:1px #aaaaaa dashed; - font-family:'Lucida Console',monaco,monospace; - margin-top:1em; - margin-bottom:1em; - overflow-x: auto; - white-space:pre; -} - -.bioc_citation { - padding-left: 1em; -} - -pre { - background-color: #e3e3e3; - padding:1em; - border:1px #aaaaaa dashed; - font-family:'Lucida Console',monaco,monospace; - margin-top:0; - margin-bottom:1em; - overflow-x: auto; - white-space:pre; -} -pre code { - color:#000000; - font-family:'Lucida Console',monaco,monospace; -} - - -/* simple grey-backgrounded box has no border. use like this -
    ...
    */ -.grey_box { - background-color: #e6e8e7; - padding:1em; -} -/* and a white-backgrounded box to alternate with the grey_box above */ -.white_box { - padding:1em; -} - -/* back to top div -

    [ Back to top ]

    */ -.back_to_top { text-align:right; } - -/* here is some styling for the search box */ -.search_box { - font-family:'Lucida Console',monaco,monospace; - border:1px #888888 solid; - padding-left:4px; - height:24px; - width:160px; - margin-right:5px; -} - -/* here is a special style for lists with giant arrows as bullets */ -ul.big_arrow_list { - margin:0; - margin-left:.1em; - padding-top:.3em; - padding-left:20px; - list-style-image: url(../images/list_big_arrow.gif) -} /* home page uses a special, "big arrow" style list */ -ul.big_arrow_list li { - padding-bottom:1em; - padding-left:3px; - background-image: none; -} - -/* an inline list with no marker */ -ul.inline_list { - list-style-type:none; - padding-right:5px; -} -ul.inline_list li { - display: inline; - padding-right:5px; -} - -/* home page has a few special styles */ -.hp_alert_box { - border-top:1px #d8dcdd solid; - border-bottom:1px #d8dcdd solid; - padding:1em; - padding-left:0; - margin:8px 8px 8px 8px; -} -.hp_options_box { margin:0 8px 0 8px; } - -/* these selectors will invoke when printing or print previewing. - this can be convenient to nicely-format the page for printing, - including certain sizing and hiding of elements. */ -@media print { - /* for elements that you don't want to print, give them a class of noprint */ - .noprint { display:none; } - #SiteContainer { margin:auto; } - #SiteGlobalFooter { padding:0; padding-top:3em; border-top:1px black solid; } - .attribution_copyright { padding:0; border:0; } - /* move the logo to the bottom of the print-out */ - #SiteMasthead { height:auto; position:static; } - .SiteMasthead { border-bottom:0; } - .masthead_logo { padding:0; float:none; } - /* shaded boxes don't need to be shaded on print. since they are - background images, they won't usually be printed anyway so this - rule tightens up the spacing. */ - .sb1,.sb2,.sb3,.sb4,.sb6,.sb7,.sb8,.sb9 { display:none; } - #PageBreadcrumbs { display:none; } - .PageContent h1, .PageContent h2 { border-bottom:1px black solid; } - #PageContent { padding-left:0; padding-right:0; padding-top:0; } - /* when printing these two divs (if present) */ - div#PageContent.WithRightRail { width:69%;float:left; } - /* need to display side-by-side w/o breaking */ - #RightRail { width:29%; padding:0 0 0 0; } - .back_to_top { display:none; } - #PageInternalLinksMenu { display:none; } - .hp_alert_box, .hp_options_box { margin:24px 0 0 0; } - - /* this overrides the sneaky way we do bullets using background images. - when printing, background images typically are omitted */ - ul { - list-style-type: disc !important; - margin:auto !important; - margin-left:1.4em !important; - margin-bottom:1em !important; - } -} - -/* styles for displaying biocViews hierarchy */ -.biocViewsTree { - float:left; - height:300px; - width:100%; - overflow:auto; -} - -.biocViewsTreePadding { -/* float:left; */ -/* width: 1%; */ -} - -.biocViewsPackages { - float:right; - width:66%; -} -.biocViewsBelowTree { - clear:both; -} - - -/* styles for package detail pages: */ - -tr.row_odd -{ - background-color: #FFF; -} - -tr.row_even -{ - background-color: #DDD; -} - -td.docFixedWidth -{ - width: 56px; -} - -/* tooltip styling */ -.tooltip { - display:none; - background-color: white; - border-style: solid; - border-width: 2px; - border-color: black; - height:250px; - padding:40px 30px 10px 30px; - width:250px; - font-size:11px; -} - -/* a .label element inside tooltip */ -.tooltip .label { - color:yellow; - width:35px; -} - -.tooltip a { - color:#ad4; - font-size:11px; - font-weight:bold; -} - -.tooltip2 { - display:none; - background-color: white; - border-style: solid; - border-width: 2px; - border-color: black; - padding:40px 30px 10px 30px; - font-size:11px; -} - -/* limit image width to prevent oversized figures on workflow pages */ -img { - max-width: 100%; -} diff --git a/assets/style/components/blockquote.css b/assets/style/components/blockquote.css new file mode 100644 index 000000000..347ae16ac --- /dev/null +++ b/assets/style/components/blockquote.css @@ -0,0 +1,24 @@ +blockquote { + margin: 1rem 0; + box-sizing: border-box; + border-left: 2px solid var(--primary); + padding: 1.25em 2em; + background-color: var(--neutral-n50); +} + +.two-col { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1.5rem; +} + +.two-col img { + max-height: 100%; + margin: 1rem 0; +} + +@media (max-device-width: 1250px), (width <= 1250px) { + .two-col { + display: block; + } +} diff --git a/assets/style/components/breadcrumbs.css b/assets/style/components/breadcrumbs.css new file mode 100644 index 000000000..372d92328 --- /dev/null +++ b/assets/style/components/breadcrumbs.css @@ -0,0 +1,32 @@ +.breadcrumbs { + list-style-type: none; + display: flex; + gap: 0.5rem; + margin: 0; + padding: 0; + line-height: 1.3rem; + color: var(--neutral-n400); +} + +.breadcrumbs li { + padding-left: 0 ; +} + +.breadcrumbs li:not(:first-of-type) { + background-image: url("/images/icons/svgs/chevron-right-n400.svg"); + background-repeat: no-repeat; + padding-left: 1.625rem; /* make space for the background image */ +} + +.breadcrumbs li:last-of-type { + font-weight: bold; +} + +.breadcrumbs a { + color: var(--neutral-n400); + text-decoration: none; +} + +.breadcrumbs li::marker { + content: none; +} diff --git a/assets/style/components/buttons.css b/assets/style/components/buttons.css new file mode 100644 index 000000000..318872a8f --- /dev/null +++ b/assets/style/components/buttons.css @@ -0,0 +1,110 @@ +.white-button { + background: var(--neutral-n50); + color: var(--primary-p400); + min-height: 20px; + max-height: 20px; + cursor: pointer; + display: block; + width: fit-content; + transition: 0.3s; + padding: 0.1rem 0.8rem; + border-radius: 8rem; + text-decoration: none; +} + +.white-button:hover { + background: var(--primary-p50); +} + +.white-button:active { + background: var(--primary-p200); +} + +.white-button * { + vertical-align: middle; +} + +.white-button svg { + margin-bottom: 1px; +} + +.white-button svg:hover { + background: var(--primary-p50); + stroke: black; +} + +.button-hero { + padding: 1rem 1.625rem; + border-radius: 16rem; + background: var(--gradient-brandreverse); + margin: auto auto 0.3rem; + transition: 0.3s; + color: #fff; + cursor: pointer; + display: block; + width: fit-content; +} + +.button-hero img { + width: 1rem; + height: 1rem; + vertical-align: middle; +} + +.button-hero:hover { + background: var(--gradient-brand); + box-shadow: 0 5px 4px 0 rgba(0 0 0 / 18%) inset; +} + +.brand-border-button { + background-image: var(--gradient-brand); + border-radius: 8rem; + box-sizing: border-box; + color: var(--primary-p400); + display: flex; + padding: 1px; + text-decoration: none; +} + +.brand-border-button svg path { + transition: stroke 0.5s ease; +} + +.brand-border-button:hover { + color: #fff; +} + +.brand-border-button:hover svg path { + stroke: #fff; +} + +.span-brand { + align-items: center; + border-radius: 4rem; + display: flex; + justify-content: center; + background: #fff; + color: var(--primary-p400); + transition: background 0.5s ease; + width: 100%; + gap: 5px; + margin: 1px; + padding-left: 0.75rem; + padding-right: 0.4rem; + line-height: 100%; +} + +.brand-border-button:hover span { + background: var(--primary-p400); + color: #fff; +} + +@media (prefers-reduced-motion: reduce) { + .button-hero, + .white-button, + .brand-border-button, + .brand-border-button svg path, + .brand-border-button span { + transition: none; + } +} diff --git a/assets/style/components/code.css b/assets/style/components/code.css new file mode 100644 index 000000000..c7780cc78 --- /dev/null +++ b/assets/style/components/code.css @@ -0,0 +1,67 @@ +pre:has(code) { + border-radius: 5px; + padding: 2px; + background: var(--gradient-brandreverse); + white-space: normal; + margin-bottom: 2rem; +} + +code * { + font-family: Courier, monospace; +} + +pre code, +pre code.hljs { + border-radius: 3px; + background: none; + background-color: var(--code-blocks-dark); + overflow-x: auto; + display: block; + padding: 1rem; + white-space: pre; + font-family: Courier, monospace; +} + +pre code, +pre code.hljs, +.hljs-punctuation { + color: white; + font-size: 1rem; + line-height: 1.3rem; +} + +.hljs-string, +.hljs-title, +.hljs-number, +.hljs-selector-class { + color: var(--code-dark-string); +} + +.hljs-literal, +.hljs-built_in { + color: var(--code-dark-literal); +} + +pre code.light .hljs-literal, +pre code.light .hljs-built_in { + color: var(--code-light-literal); +} + +pre code.dark .hljs-operator { + color: var(--code-dark-operator); +} + +pre code.light { + background-color: white; +} + +.hljs.light, +pre code.light .hljs-punctuation, +pre code.light { + color: var(--default-body); +} + +pre code.light .hljs-string, +pre code.light .hljs-title { + color: var(--code-light-string); +} diff --git a/assets/style/components/gallery.css b/assets/style/components/gallery.css new file mode 100644 index 000000000..86dcf0d38 --- /dev/null +++ b/assets/style/components/gallery.css @@ -0,0 +1,22 @@ +.gallery { + display: flex; + flex-wrap: wrap; + gap: 2rem; + margin-bottom: 4rem; +} + +.gallery-card { + width: 320px; + flex-grow: 1; +} + +.gallery-card img { + display: block; + width: 100%; + margin-bottom: 1rem; +} + +.gallery-card a { + color: black; + text-decoration: underline; +} diff --git a/assets/style/components/lists.css b/assets/style/components/lists.css new file mode 100644 index 000000000..38f4e3a80 --- /dev/null +++ b/assets/style/components/lists.css @@ -0,0 +1,28 @@ +ul { + padding: 0; + list-style: none; + padding-left: 10px; +} + +li { + margin-bottom: 0.5rem; + padding-left: 8px; +} + +li::marker { + content: "•"; + color: var(--primary); + display: inline; + font-size: 0.8rem; + margin-right: 0.5rem; + width: 0.25rem; + height: 0.25rem; +} + +li:has(p) { + margin-left: 1rem; +} + +li:has(p)::before { + margin-left: -1.1rem; +} diff --git a/assets/style/components/tables.css b/assets/style/components/tables.css new file mode 100644 index 000000000..287319131 --- /dev/null +++ b/assets/style/components/tables.css @@ -0,0 +1,40 @@ +td { + padding: 1rem; + border: 1px solid var(--neutral-n75); + vertical-align: top; +} + +table { + border-spacing: 0; + margin-bottom: 1rem; + border-radius: 3px; +} + +table.full-width { + width: 100%; +} + +.dataTables_scrollHead { + background: var(--neutral-n75); + padding-top: 10px; +} + +tr:first-of-type *:first-child { + border-top-left-radius: 3px; +} + +tr:first-of-type *:last-child { + border-top-right-radius: 3px; +} + +tr:last-of-type *:first-child { + border-bottom-left-radius: 3px; +} + +tr:last-of-type *:last-child { + border-bottom-right-radius: 3px; +} + +table.full-width tr *:first-child { + width: 15.5rem; +} diff --git a/assets/style/existing.css b/assets/style/existing.css new file mode 100644 index 000000000..cf87fb1d5 --- /dev/null +++ b/assets/style/existing.css @@ -0,0 +1,8 @@ +.grey_box { + background-color: var(--primary-p50); +} + +.grey_box, +.white_box { + padding: 1.5rem; +} diff --git a/assets/style/fonts/AtkinsonHyperlegible-Bold.ttf b/assets/style/fonts/AtkinsonHyperlegible-Bold.ttf new file mode 100644 index 000000000..c72b4889f Binary files /dev/null and b/assets/style/fonts/AtkinsonHyperlegible-Bold.ttf differ diff --git a/assets/style/fonts/AtkinsonHyperlegible-Bold.woff b/assets/style/fonts/AtkinsonHyperlegible-Bold.woff new file mode 100644 index 000000000..b8a112910 Binary files /dev/null and b/assets/style/fonts/AtkinsonHyperlegible-Bold.woff differ diff --git a/assets/style/fonts/AtkinsonHyperlegible-Regular.ttf b/assets/style/fonts/AtkinsonHyperlegible-Regular.ttf new file mode 100644 index 000000000..23614a4d3 Binary files /dev/null and b/assets/style/fonts/AtkinsonHyperlegible-Regular.ttf differ diff --git a/assets/style/fonts/AtkinsonHyperlegible-Regular.woff b/assets/style/fonts/AtkinsonHyperlegible-Regular.woff new file mode 100644 index 000000000..10878de62 Binary files /dev/null and b/assets/style/fonts/AtkinsonHyperlegible-Regular.woff differ diff --git a/assets/style/pages/about.css b/assets/style/pages/about.css new file mode 100644 index 000000000..02f60f02d --- /dev/null +++ b/assets/style/pages/about.css @@ -0,0 +1,37 @@ +.about-join .join { + width: 99.8%; + margin-bottom: 2rem; +} + +.about-join .join-img-div { + display: none; +} + +.about-join .gradient-border-inner { + padding: 2rem; +} + +.about-join .join-content, +.about-join h2 { + padding: 0; +} + +.about-join .join-buttons { + padding-bottom: 0.62rem; +} + +/* disabled here due to a linting error, but we need the webkit marker for this to work */ + +/* stylelint-disable */ +.about-join .text-gradient { + background: var(--misc-pink); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +/* stylelint-enable */ + +#european-bioconductor-society { + display: grid; + grid-template-columns: 1fr 75px; + gap: 1rem; +} diff --git a/assets/style/pages/get-started.css b/assets/style/pages/get-started.css new file mode 100644 index 000000000..8e63a7527 --- /dev/null +++ b/assets/style/pages/get-started.css @@ -0,0 +1,132 @@ +.install-hero { + margin: 0 auto; + display: flex; + flex-direction: column; + align-items: flex-start; + padding-top: 0.5rem; +} + +.get-started-h1 { + color: var(--misc-dark) !important; +} + +.instructions-install { + flex: 1; + display: flex; + flex-direction: column; + align-items: flex-start; + padding-bottom: 2rem; +} + +.instructions-install p { + text-align: left; + margin: 0 0 1rem; +} + +.instructions-install a { + color: var(--misc-dark); +} + +/* stylelint-disable color-function-notation, alpha-value-notation */ +.warmcool-gradient { + background-image: var(--gradient-reversewarmcool); + border-radius: 0.5rem; + box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.06), 0 2px 5px 0 rgba(0, 0, 0, 0.06), + 0 10px 10px 0 rgba(0, 0, 0, 0.05), 0 22px 13px 0 rgba(0, 0, 0, 0.03), + 0 39px 16px 0 rgba(0, 0, 0, 0.01), 0 61px 17px 0 rgba(0, 0, 0, 0); +} + +.install-row { + border-radius: 0.5rem; + display: flex; + flex-direction: row; + margin: 1px; + gap: 3rem; +} + +.install-content { + background: #fff; + display: flex; + flex-direction: column; + flex: 1; + padding: 0.9rem 1.5rem; + border-radius: 0.5rem; +} + +.install-blockquote { + border-left: 2px solid var(--misc-purple); + background-color: transparent; + display: flex; + align-items: flex-start; + justify-content: space-around; + padding: 0; + padding-left: 10px; + gap: 10px; +} + +.install-section { + margin-top: 1.5rem; + margin-bottom: 1.5rem; +} + +.install-section a { + color: black; +} + +.code-install { + margin-top: 1.6rem; + width: 100%; + box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.06), 0 2px 5px 0 rgba(0, 0, 0, 0.06), + 0 10px 10px 0 rgba(0, 0, 0, 0.05), 0 22px 13px 0 rgba(0, 0, 0, 0.03), + 0 39px 16px 0 rgba(0, 0, 0, 0.01), 0 61px 17px 0 rgba(0, 0, 0, 0); +} + +/* stylelint-enable color-function-notation, alpha-value-notation */ + +.code-install code { + font-size: 1.25rem; + text-align: start; +} + +.step-1 { + padding-bottom: 0.5rem; +} + +.step-3 { + align-self: end; +} + + +@media (max-device-width: 1250px), (width <= 1250px) { + .instructions-install img { + display: none; + } + + .instructions-install { + padding-bottom: 0; + } + + .install-row { + flex-direction: column; + + /* stylelint-disable-next-line value-no-vendor-prefix */ + width: -webkit-fill-available; + gap: 1.5rem; + } + + .code-install { + margin-top: 0; + } + + .install-section { + width: calc(100vw - 350px); + } +} + +@media (max-device-width: 768px), (width <= 768px) { + .install-section { + width: initial; + } + +} + diff --git a/assets/style/pages/home.css b/assets/style/pages/home.css new file mode 100644 index 000000000..26fda02af --- /dev/null +++ b/assets/style/pages/home.css @@ -0,0 +1,724 @@ +.data-scientist-and-developer-info { + display: flex; + flex-wrap: wrap; + width: fit-content; +} + +.tab-radio { + display: none; +} + +.tab-label { + margin-top: 1.5rem; + border-radius: 8px; + padding: 12px 24px; + background: var(--neutral-n50); + cursor: pointer; +} + +.data-scientist-radio { + margin-left: auto; + margin-right: 0.4rem; +} + +.developer-radio { + margin-left: 0.4rem; + margin-right: auto; +} + +.tab-content { + order: 1; + display: none; + transition: 0.3s; + margin-top: 0.75rem; + width: 100%; + margin-bottom: 1rem; +} + +/* checked tab */ +.tab-radio:checked + .tab-label { + background: var(--primary-p500); + color: #fff; +} + +.tab-radio:checked + .tab-label + .tab-content { + display: block; +} + +.doodle-data-scientist-container { + display: flex; + justify-content: center; + margin-top: 1rem; + margin-bottom: 1rem; +} + +.brand-gradient-border { + background-image: var(--gradient-brand); + border-radius: 4px; + padding: 1px; +} + +.warmcool-gradient-border { + background-image: var(--gradient-warmcool); + border-radius: 4px; + padding: 1px; + margin-top: 1rem; + margin-bottom: 1rem; +} + +.data-scientist-container h2, +.developer-container h2 { + text-align: center; + margin: 1.5rem auto 0; +} + +.data-scientist-content { + background: #fff; + padding: 2rem 2rem 0.8rem; + border-radius: 4px; + width: 49rem; +} + +.data-scientist-content a { + color: black; +} + +.data-scientist-rest-row { + display: flex; + flex-direction: row; + gap: 0.7rem; + align-items: center; +} + +.left-doodle { + margin-left: auto; + margin-right: 18px; + display: flex; + align-items: flex-start; + height: 100%; +} + +.right-doodle { + display: flex; + align-items: center; + margin-right: auto; + margin-left: 18px; + margin-top: 280px; + height: 100%; +} + +.green-box { + background-color: var(--secondary-s50); + height: auto; + flex-direction: column; + display: flex; + justify-content: space-between; + padding: 1.25rem; + padding-bottom: 0.3rem; + padding-right: 1rem; + padding-left: 1rem; +} + +.doodle-developer-container img { + max-width: 15%; + height: 30%; +} + +.user-quote { + background: var(--neutral-n50); + padding: 1rem; + border-radius: 4px; + display: flex; +} + +.user-quote p { + margin-bottom: 0; + margin-top: 0.5rem; +} + +.user-quote img { + margin-right: 1.5rem; +} + +.green-box p img { + vertical-align: middle; + margin-bottom: 2px; +} + +.learn-nav a { + border: 1px solid var(--primary-p75); + border-radius: 0.5rem; + padding: 1rem; + align-items: center; + text-decoration: underline; + color: inherit; + display: flex; + justify-content: space-between; + + /* gradient backgrounds are difficult to add transition */ + transition: background 0.5s ease; +} + +.join-buttons a { + width: fit-content; + text-decoration: none; +} + +.green-box p a { + vertical-align: middle; + cursor: pointer; +} + +.data-scientist-rest { + display: flex; + flex-direction: column; + padding: 1rem 0.7rem 0.6rem; +} + +.data-dev-chip { + background: var(--gradient-purpleblue); + color: white; + border-radius: 4rem; + text-decoration: none; + display: flex; + justify-content: space-between; + align-items: center; + margin: auto; +} + +.data-chip { + padding: 0.55rem 1rem; + max-width: 51rem; +} + +.dev-chip { + padding: 0.75rem 1rem; + max-width: 55rem; +} + +.data-scientist-chip * { + vertical-align: middle; +} + +.data-scientist-chip svg { + margin-bottom: 3px; +} + +.doodle-developer-container { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + margin-left: 1.4rem; + margin-right: 1.4rem; +} + +.developer-content { + padding: 2rem 2rem 1.5rem; + border-radius: 4px; + background: var(--code-blocks-dark); + max-height: 24rem; + width: 53rem; +} + +.dev-navs { + display: flex; + flex-direction: row; + justify-content: space-around; +} + +.dev-nav { + display: flex; + flex-direction: column; + flex: 1; +} + +.dev-nav p a { + text-decoration: underline; + color: #fff; + font-family: Courier, monospace; +} + +.dev-nav p { + color: var(--error-e100); +} + +.dev-quote { + background: var(--misc-dark); + padding: 1rem; + border-radius: 4px; + display: flex; + align-items: center; + gap: 1.3rem; + margin: 2rem 2rem 0; +} + +.dev-quote p { + color: #fff; + margin-bottom: 0; + margin-top: 0.3rem; +} + +.news p { + border-left: 3px solid; + border-color: var(--primary); + padding-left: 12px; + margin-top: 6px; + margin-bottom: 6px; +} + +.info p { + padding-bottom: 1rem; +} + +.data-dev-logo p { + text-align: center; + margin-bottom: 0; + padding-top: 0.25rem; +} + +.dev-quote p:first-child { + margin-top: 0; +} + +.dev-quote p:last-child { + font-size: 0.8125rem; + line-height: 120%; + padding-top: 0.2rem; +} + +.data-dev-logo { + display: inherit; + gap: 0.62rem; + color: #fff; + font-size: 1.1rem; + font-weight: 700; + line-height: 130%; +} + +.mobile-text-block { + display: none; +} + +.events { + padding-top: 2rem; +} + +.events-header { + display: flex; + width: 100%; + justify-content: space-between; + margin-bottom: 1rem; +} + +.events-header h3 { + margin-left: 1rem; +} + +.events-container { + display: flex; + overflow-x: scroll; + gap: 1.56rem; + margin-bottom: 1.5rem; + width: 100vw; + -ms-overflow-style: none; + + /* disable scrollbar for IE and Edge */ + scrollbar-width: none; +} + +.events-container.active { + cursor: grabbing; +} + +.events-container::-webkit-scrollbar { + display: none; +} + +.event-card-container { + display: inline-block; + background-color: white; + padding: 1.5rem; + min-width: 17.5rem; + max-width: 17.5rem; + max-height: 12.25rem; +} + +.event-card { + height: 100%; + width: 100%; +} + +.event-card .format-bold { + margin-top: 0; + margin-bottom: 1.5rem; + width: 100%; + flex: 1 0 0; + align-self: stretch; + height: 4.75rem; + color: var(--primary-p500); + max-width: 12.8rem; +} + +.event-date-location { + padding-top: 1rem; + border-top: 1px solid; + border-color: var(--primary-p-50, #ebf4f7); +} + +.event-date-location * { + margin-block-start: 0; + margin-block-end: 0; + color: var(--neutral-n400); +} + +.information-container { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); + background-color: inherit; + gap: 2rem; + margin-top: 2rem; + margin-bottom: 2rem; +} + +.news, +.packages, +.about-bioconductor { + padding: 2rem; + border-radius: 0.5rem; + background-color: white; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.information-container section * { + text-align: start; +} + +.info-section-button-padding { + width: fit-content; + margin-top: 1.5rem; +} + +.info-section-button-padding .brand-border-button { + height: 2.5rem; +} + +/* components css */ +.gradient-border { + border-radius: 4px; + padding: 1px; + margin-top: 1rem; + margin-bottom: 1rem; +} + +.section-block { + background: #fff; + padding: 2rem; + border-radius: 4px; +} + +.section-block h4, +.section-block h2 { + margin-top: 0; +} + +/* Learn section CSS */ +.learn { + background-image: var(--gradient-brand); +} + +.learn-content { + display: flex; + flex-direction: row; + gap: 1rem; +} + +.info { + flex: 1; + gap: 0.5rem; +} + +.learn-nav { + display: flex; + flex-direction: column; + gap: 0.625rem; + flex: 1; +} + +.learn-nav a:hover { + background-image: var(--gradient-brand); + color: #fff; +} + +.learn-nav svg path { + /* transition: stroke 0.5s ease; */ + transform: translateX(0); + transition: transform 0.2s ease; +} + +.learn-nav a:hover svg path { + stroke: #fff; + transform: translateX(3px); +} + +.button-padding { + width: 41%; + padding-top: 1.5rem; + padding-bottom: 1.5rem; +} + +.info .brand-border-button { + height: 2.5rem; + width: 100%; +} + +/* Join section CSS */ + +.join { + background-image: var(--gradient-reversewarmcool); + border-radius: 8px; + margin-bottom: 3rem; +} + +.gradient-border-inner { + padding: 0 0 2rem; + border-radius: 8px; + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +.join-row { + order: -1; + display: none; + width: 100%; + transition: 0.3s; +} + +.tabs-join-radio:checked + .join-row { + display: flex; + justify-content: space-between; +} + +input[type="radio"].tabs-join-radio { + appearance: none; + background-color: #fff; + box-shadow: inset 1em 1em var(--primary-p50); + width: 1em; + height: 1em; + content: ""; + border-radius: 50%; + display: grid; +} + +input[type="radio"].tabs-join-radio::before { + content: ""; + border-radius: 50%; + transform: scale(0); + transition: 120ms transform ease-in-out; + box-shadow: inset 1em 1em var(--primary); +} + +input[type="radio"].tabs-join-radio:checked::before { + transform: scale(1); +} + +.join-content { + padding-left: 4rem; +} + +.join-content h2 { + padding-top: 4rem; +} + +/* stylelint-disable property-no-vendor-prefix */ +.text-gradient { + background: var(--gradient-reversewarmcool); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +/* stylelint-enable property-no-vendor-prefix */ + +.join-img-div { + width: 400px; + max-height: 276px; + flex-shrink: 0; +} + +.join-buttons { + display: flex; + flex-direction: row; + align-items: center; + gap: 1rem; + padding-bottom: 3rem; + padding-top: 2rem; +} + +.join-buttons span { + padding: 0.73rem 0.93rem 0.73rem 1.1rem; +} + +.learn-more { + padding-left: 1rem; + color: var(--primary-p400); +} + +hr { + position: absolute; + left: 0; + width: 100vw; + border: none; + border-top: 0.13rem solid var(--secondary-s75); +} + +@media (max-device-width: 768px), (width <= 768px) { + .doodle-developer-container img, + .left-doodle img, + .right-doodle img, + .user-quote img { + display: none; + } + + .data-scientist-content, + .developer-content { + width: fit-content; + height: auto; + display: flex; + flex-direction: column; + padding: 1rem; + } + + .tab-content { + margin-bottom: 0; + } + + .tab-label { + padding: 0.75rem 0.5rem; + } + + .data-scientist-content p { + font-size: 1rem; + } + + .dev-navs { + display: flex; + flex-direction: column; + } + + .dev-quote p, + .user-quote p { + font-size: 0.8125rem; + } + + .user-quote p { + margin-top: 0; + } + + .mobile-text-block p { + text-align: left; + } + + .info p { + padding-bottom: 0; + } + + .user-quote p:last-child { + margin-top: 0.5rem; + } + + .dev-quote p:last-child { + font-weight: 400; + } + + .data-dev-chip { + display: none; + } + + .mobile-text-block { + background-image: var(--gradient-purpleblue); + width: calc(100% - 4rem); + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + padding: 0.75rem 0.63rem; + border-radius: 0.25rem; + } + + .mobile-text-block .data-dev-logo { + display: flex; + align-items: center; + } + + .learn-block { + display: flex; + flex-direction: column; + padding: 1.5rem; + } + + .learn-content { + display: flex; + flex-direction: column; + } + + .button-padding { + width: 60%; + padding-top: 0.5rem; + padding-bottom: 1rem; + } + + .events-header { + margin: auto; + } + + .information-container { + display: flex; + flex-direction: column; + align-items: center; + } + + .join-content { + padding: 1.5rem; + } + + .join-row h2 { + padding-top: 0; + } + + .join-img-div { + display: none; + } + + .join-buttons { + padding-top: 1rem; + padding-bottom: 1rem; + } + + .homepage-block .text-large { + font-size: 1rem; + } +} + +@media (prefers-reduced-motion: reduce) { + .learn-nav a:hover { + background: inherit; + color: inherit; + transition: none; + } + + .learn-nav a:hover svg path { + stroke: var(--primary-p75); + transition: none; + transform: none; + } +} + +@media (max-device-width: 1250px), (width <= 1250px) { + .left-doodle, + .right-doodle { + display: none; + } +} diff --git a/assets/style/pages/learn-and-dev.css b/assets/style/pages/learn-and-dev.css new file mode 100644 index 000000000..4cdf5dc06 --- /dev/null +++ b/assets/style/pages/learn-and-dev.css @@ -0,0 +1,197 @@ +.page-container { + display: flex; + flex-direction: column; + padding: 32px; + border: 1px solid #0000; + border-radius: 4px; + background: linear-gradient(white, white) padding-box, + var(--gradient-brand) border-box; + margin-bottom: 1rem; +} + +.upper-container { + display: flex; + padding: 0; + gap: 56px; +} + +.lower-container { + padding: 8px 0 24px; +} + +.page-container hr { + position: static; + width: 100%; + height: 1px; + background: var(--primary-p75); + border: none; +} + +.page-container li::before { + all: unset; +} + +.page-container li:has(p) { + margin: 0; +} + +.page-intro { + width: 24.188rem; + height: 100%; +} + +.upper-content { + padding: 8px 0 24px; + display: flex; + flex-direction: column; + align-items: flex-start; + flex: 1 0 0; +} + +.lower-content { + display: flex; + justify-content: space-between; + gap: 1rem; +} + +.bottom-chip { + background-image: url("/images/icons/svgs/chevron-right-purple-chip.svg"), + var(--gradient-purpleblue); + background-repeat: no-repeat, no-repeat; + background-position: 99% 50%, 0 0; + padding: 0.75rem 1rem; + border-radius: 4rem; + text-decoration: none; + display: flex; + align-items: center; + text-align: start; + color: #fff; +} + +.bottom-chip p { + margin-bottom: 0; +} + +.bottom-chip mark { + background-color: inherit; + color: #fff; +} + +.bottom-chip-logo { + margin-right: 10px; +} + +.upper-content > section, +.lower-content > section { + width: 100%; +} + +.upper-content > section > ul, +.lower-content > section > ul { + display: flex; + flex-direction: column; + gap: 1rem; +} + +.upper-content > section li, +.lower-content > section li { + border: 1px solid; + border-color: var(--primary-p75); + padding: 1rem; + margin-bottom: 0; + border-radius: 0.5rem; + align-items: center; + color: inherit; + display: flex; + justify-content: space-between; + transition: background 0.2s; + background-image: url("/images/icons/svgs/arrow-circle-right-blue.svg"); + background-repeat: no-repeat; + background-position: 98.5% 50%; +} + +.upper-content > section li *, +.lower-content > section li * { + margin-bottom: 0; +} + +.upper-content > section li svg path, +.lower-content > section li svg path { + /* transition: stroke 0.5s ease; */ + transform: translateX(0); + transition: transform 0.2s ease; +} + +.publications-footer { + border-left: 3px solid var(--primary-p-300, #3792ad); + padding-right: 0.75rem; + padding-left: 0.75rem; +} + +.prev-releases-footer a { + border-left: 3px solid var(--primary-p-300, #3792ad); + padding-right: 0.75rem; + padding-left: 0.75rem; + display: block; +} + +.learn-chevron { + width: 1.5rem; + height: 1.5rem; +} + +.learn-question-mark { + vertical-align: middle; +} + +.upper-content > section li:hover, +.lower-content > section li:hover { + background-image: url("/images/icons/svgs/arrow-circle-right-white.svg"), + var(--gradient-brand); + background-repeat: no-repeat, no-repeat; + background-position: 99% 50%, 0 0; +} + +.upper-content > section li:hover *, +.lower-content > section li:hover * { + color: #fff; +} + +.upper-content > section li:hover svg path, +.lower-content > section li:hover svg path { + stroke: #fff; + transform: translateX(3px); +} + +@media (max-device-width: 768px), (width <= 768px) { + .page-container { + padding: 1rem; + } + + .page-container * { + font-size: 1rem; + } + + .page-container * a { + max-width: 16rem; + } + + .upper-container, + .lower-content { + flex-direction: column; + gap: 0; + } + + .page-intro { + width: 100%; + } + + .bottom-chip { + border-radius: 4px; + background-image: var(--gradient-purpleblue); + } + + .learn-chevron { + display: none; + } +} diff --git a/assets/style/pages/packages.css b/assets/style/pages/packages.css new file mode 100644 index 000000000..f7a47b594 --- /dev/null +++ b/assets/style/pages/packages.css @@ -0,0 +1,149 @@ +/* stylelint-disable selector-class-pattern, selector-id-pattern */ + +details { + margin: 1rem 0; +} + +summary.package-details { + display: block; + margin: 1rem 0; + font-weight: 700; + background-image: url("/images/icons/svgs/chevron-down.svg"); + background-repeat: no-repeat; + background-position: center right; + cursor: pointer; +} + +.badges { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +.biocViewsTreeContainer { + display: flex; + flex-direction: row; + justify-content: center; + gap: 2rem; + margin-left: 1px; +} + +.biocViewsPackages { + display: flex; + flex-direction: column; +} + +.packages-subnav, +#biocViews_package_table select { + padding: 1rem; + border: 1px solid #0000; + border-radius: 0.5rem; +} + +.packages-subnav { + background: linear-gradient(white, white) padding-box, + var(--gradient-purpleblue) border-box; + margin-top: 8px; + float: left; + width: 33%; + height: fit-content; +} + +.package-input, +#biocViews_package_table_filter input { + border-radius: 0.25rem; + border: 1px solid var(--neutral-n75); + height: 2rem; + padding: 0 0.5rem; +} + +.package-input { + margin-top: 0.63rem; +} + +#biocViews_package_table_info { + margin-top: 1rem; +} + +#package-info-wrapper, +#package-entries-wrapper { + display: flex; + justify-content: space-between; +} + +#biocViews_package_table_paginate { + display: inherit; + margin: 1rem 0 2rem; + font-weight: 700; + gap: 1rem; +} + +#biocViews_package_table_previous, +#biocViews_package_table_next { + color: var(--neutral-n200); + cursor: pointer; +} + +#biocViews_package_table_filter label { + gap: 24px; + display: flex; + align-items: center; +} + +#package-entries-wrapper { + margin-bottom: 1rem; + align-items: center; +} + +#biocViews_package_table_length select { + padding: 0.5rem 0.65rem 0.5rem 0.5rem; + border: 2px solid var(--neutral-n75); + border-radius: 0.5rem; +} + +#badges-box section, +#badges-box p { + margin-left: 0.5rem; + margin-top: 0.5rem; +} + +#badges-box p { + border-left: 0.19rem solid var(--primary); + padding-left: 0.75rem; +} + +ul.ui-autocomplete li::marker { + content: none; +} + +.bioc-citation { + background-color: var(--neutral-n50); + border: 1px solid var(--neutral-n75); + padding: 1rem 1rem 0; + margin: 0.5rem 0 1rem; +} + +@media (max-device-width: 1450px), (max-width: 1450px) { + .biocViewsTreeContainer { + display: flex; + flex-direction: column; + } + + .packages-subnav { + float: none; + width: inherit; + } + + #autocompleter { + width: 95%; + } + + #package-entries-wrapper { + flex-direction: column; + align-items: flex-start; + } + + #package-info-wrapper { + gap: 2rem; + } +} diff --git a/assets/style/sections/announcement.css b/assets/style/sections/announcement.css new file mode 100644 index 000000000..ee4371cb4 --- /dev/null +++ b/assets/style/sections/announcement.css @@ -0,0 +1,51 @@ +.announcement { + display: grid; + grid-template-columns: 1.25rem auto; + align-items: center; + justify-content: center; + gap: 0.25rem; + padding-top: 0.8rem; + padding-bottom: 0.8rem; + background-color: var(--misc-dark); + color: #fff; + stroke: #fff; + margin: 0; +} + +.announcement p { + font-size: 0.8125rem; + font-weight: 700; + margin: 0; +} + +.announcement svg { + width: 1.25rem; + height: 1.25rem; +} + +.announcement-warning { + background-color: var(--misc-warning); + color: var(--misc-dark); + stroke: var(--misc-dark); +} + +.announcement-error { + background-color: var(--misc-error); + color: #fff; + stroke: #fff; +} + +.announcement-brand { + background-image: var(--gradient-brand); + color: #fff; + stroke: #fff; +} + +@media (max-device-width: 768px), (width <= 768px) { + .announcement { + padding: 0.625rem; + gap: 0.5rem; + text-align: center; + } +} + diff --git a/assets/style/sections/footer.css b/assets/style/sections/footer.css new file mode 100644 index 000000000..2e89db5c8 --- /dev/null +++ b/assets/style/sections/footer.css @@ -0,0 +1,121 @@ +footer { + margin-left: auto; + margin-right: auto; + width: 100%; /* 1400p x */ + background-color: #121212; + padding: 2.5rem 6.25rem; /* 40px, 100px */ + border-style: solid; + border-width: 0.625rem 0 0; /* 10px */ + border-image: var(--gradient-brandreverse) 1; + color: #fff; + font-size: 1rem; + height: auto; + box-sizing: border-box; +} + +footer * { + color: #fff; + text-decoration: none; +} + +.footer-container { + max-width: 1400px; + margin: auto; +} + +.link-container { + display: grid; + grid-template-columns: 1fr 1fr; + margin-bottom: 3.5rem; +} + +.link-container-inner { + display: flex; + justify-content: flex-start; + width: 100%; + margin-bottom: 1rem; +} + +:is(.link-container-inner nav) { + display: flex; + flex-direction: column; + align-items: start; + gap: 0.625rem; + padding-inline-start: 0; + margin-right: auto; +} + +.logo-contact-container { + display: flex; + justify-content: space-between; + align-items: flex-end; +} + +.socials-logo-container { + display: flex; + align-items: center; + gap: 4rem; +} + +.socials img { + padding-right: 2rem; /* 30px */ + margin-bottom: 0; +} + +.socials { + margin-top: 1.5rem; + margin-bottom: 0.5rem; +} + +.footer-logo { + width: 12rem; + height: 3.5rem; + padding-top: 1rem; +} + +@media (max-device-width: 768px), (width <= 768px) { + footer { + display: flex; + padding: 2rem; + justify-content: center; + } + + .link-container { + display: block; + margin-bottom: 0; + } + + :is(.link-container-inner nav) { + min-width: 10rem; + margin-inline-end: 0; + } + + .list-container-inner { + margin-bottom: 1.25rem; + } + + .logo-contact-container { + align-items: flex-start; + flex-direction: column; + } + + .copyright { + margin-top: 2rem; + } + + .footer-logo { + width: 12rem; + height: 3.5rem; + } + + .socials-logo-container { + display: block; + padding: 1rem 0; + } + + .socials { + margin: auto; + padding-right: 1rem; + padding-left: 1rem; + } +} diff --git a/assets/style/sections/header.css b/assets/style/sections/header.css new file mode 100644 index 000000000..d8d7c0c41 --- /dev/null +++ b/assets/style/sections/header.css @@ -0,0 +1,273 @@ +header { + position: sticky; + top: 0; + background: #fff; + z-index: 2; +} + +.header-size { + margin: 0 auto; + max-width: 1400px; + display: flex; + justify-content: space-between; + align-items: center; + width: calc(100% - 3rem); + padding-top: 1.5rem; + padding-bottom: 1rem; +} + +.header-logo { + display: flex; + align-items: center; +} + +.header-nav { + display: flex; + flex-direction: row; + align-items: center; + gap: 1.5rem; +} + +.header-size a { + text-decoration: transparent; + color: var(--misc-dark); + transition: 300ms; +} + +.nav-links { + display: flex; + gap: 2rem; + margin-right: 0.5rem; +} + +.nav-links a:hover, +.nav-links a.active { + text-decoration: underline; + text-underline-offset: 7px; + text-decoration-thickness: 3px; + text-decoration-color: var(--primary); +} + +.search-container { + border: 1px solid var(--neutral-n75); + border-radius: 4rem; + width: 15rem; + height: 2.5rem; + display: flex; + align-items: center; + justify-content: space-between; + padding-left: 0.75rem; + padding-right: 0.75rem; +} + +.site-search { + display: flex; + align-items: center; + gap: 0.38rem; +} + +.search-bar { + border: none; + outline: none; + background-color: transparent; + padding-left: 0.25rem; + padding-top: 5px; +} + +input::placeholder { + font-size: 1rem; + font-style: normal; + line-height: 1.3rem; + color: var(--misc-dark); +} + +input:focus::placeholder { + color: transparent; +} + +.masthead-logo { + display: flex; + justify-content: center; + align-items: center; +} + +.masthead-logo img { + width: 12.6rem; + height: 3.6rem; + flex-shrink: 0; +} + +.header-button { + background-image: var(--gradient-brand); + border-radius: 8rem; + box-sizing: border-box; + color: var(--primary-p400); + display: flex; + height: 2.5rem; + padding: 1px; + width: 8.8rem; + text-decoration: none; +} + +.header-button svg path { + transition: stroke 0.5s ease; +} + +.header-button:hover { + color: #fff; +} + +.header-button:hover svg path { + stroke: #fff; +} + +.get-started { + align-items: center; + border-radius: 4rem; + display: flex; + justify-content: center; + background: #fff; + color: var(--primary-p400); + transition: background 0.5s ease; + width: 100%; + gap: 5px; + margin: 1px; + padding: 0.5rem 0.4rem 0.5rem 0.75rem; + line-height: 100%; +} + +.header-button:hover span { + background: var(--primary-p400); + color: #fff; +} + +.nav-mobile { + display: none; +} + +.bar { + display: block; + width: 25px; + height: 3px; + border-radius: 25px; + margin: 5px auto; + transition: all 0.3s ease-in-out; + background-color: var(--misc-dark); +} + +@media (max-device-width: 1080px), (width <= 1080px) { + .header-size { + justify-content: space-between; + align-items: center; + padding: 1rem 0.5rem; + } + + .header-nav { + position: absolute; + flex-direction: column; + width: 100vw; + left: 0; + background-color: #fff; + transition: 0.3s; + gap: 0; + top: 100%; + height: 2px; + overflow: hidden; + opacity: 0; + } + + .header-nav.active { + opacity: 1; + height: 21rem; + } + + .nav-mobile { + display: flex; + flex-direction: row; + align-items: center; + gap: 0.7rem; + } + + .nav-mobile h6 { + margin: 0; + } + + .nav-links { + flex-direction: column; + gap: 0; + margin-top: 0.5rem; + border-top: 1px solid var(--neutral-n75); + padding-top: 0.5rem; + margin-right: 0; + } + + .nav-links a { + text-decoration: none !important; + width: 100vw; + border-bottom: 1px solid var(--neutral-n75); + padding-left: 1.5rem; + padding-bottom: 1rem; + box-sizing: border-box; + } + + .search-container { + height: 2.5rem; + display: flex; + width: calc(100vw - 3rem); + align-items: center; + justify-content: space-between; + padding-left: 0.75rem; + padding-right: 0; + } + + .header-button { + background-image: var(--gradient-brand); + color: var(--primary-p400); + display: flex; + width: 100%; + border-radius: 0%; + align-items: center; + padding: 1.5rem 0; + } + + .get-started { + background: none; + color: #fff; + flex-direction: column; + align-items: flex-start; + margin: 0.5rem; + } + + .get-started svg { + display: none; + } + + .nav-links a, + .search-container, + .header-button { + margin: 0.5rem 0; + } + + .hamburger { + display: block; + cursor: pointer; + } + + .hamburger.active .bar:nth-child(2) { + opacity: 0; + } + + .hamburger.active .bar:nth-child(1) { + transform: translateY(8px) rotate(45deg); + } + + .hamburger.active .bar:nth-child(3) { + transform: translateY(-8px) rotate(-45deg); + } +} + +@media (prefers-reduced-motion) { + .header-nav { + transition: none; + } +} diff --git a/assets/style/sections/hero.css b/assets/style/sections/hero.css new file mode 100644 index 000000000..dbf8e180e --- /dev/null +++ b/assets/style/sections/hero.css @@ -0,0 +1,55 @@ +.hero { + width: 100%; + margin: 0 auto; + text-align: center; + background-color: white; + padding-top: 2rem; +} + +.homepage-container { + padding-top: 2rem; + padding-bottom: 4rem; +} + +.hero h1 { + color: var(--primary-p500); +} + +/* disabled here due to a linting error, but we need the webkit marker for this to work */ + +/* stylelint-disable */ +.hero mark { + background: var(--gradient-brandreverse); + background-clip: text; + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} +/* stylelint-enable */ + +.hero p { + margin-top: 1.5rem; + margin-bottom: 2.5rem; +} + +a.button-hero { + text-decoration: none; +} + +.mobile-break { + display: none; +} + +@media (max-device-width: 768px), (width <= 768px) { + .homepage-container { + padding: 1rem 0.5rem; + } + + .mobile-break { + display: block; + } + + .hero p { + margin: 0; + margin-bottom: 1rem; + } +} diff --git a/assets/style/sections/sidebar.css b/assets/style/sections/sidebar.css new file mode 100644 index 000000000..8551592ce --- /dev/null +++ b/assets/style/sections/sidebar.css @@ -0,0 +1,198 @@ +.left-col { + height: 100%; + position: relative; + grid-area: left-col; + display: flex; + flex-direction: column; + gap: 1rem; + z-index: 1; +} + +.mobile-chevron { + display: none; +} + +.left-col-inner { + position: sticky; + top: 10rem; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 1rem; + margin: 0 0 1rem 1rem; +} + +.sidebar-nav-container { + width: 100%; + background-color: inherit; + margin-right: 1rem; +} + +#header-sidebar-container { + display: none; +} + +.sidebar-nav { + transition: 0.3s; + width: 100%; + display: flex; + flex-direction: column; + gap: 10px; + padding: 8px; + border: 1px solid #0000; + border-radius: 8px; + background: linear-gradient(white, white) padding-box, + var(--gradient-brand) border-box; + height: fit-content; + max-height: calc(100vh - 13rem); +} + +.internal-nav { + transition: 0.3s; + display: flex; + flex-direction: column; + gap: 10px; + padding: 8px; + overflow: scroll; +} + +.internal-nav p { + padding: 0.5rem; + padding-bottom: 1rem; + margin-bottom: 0; + border-bottom: 1px solid var(--primary-p50); +} + +.sidebar-nav-button { + padding: 8px; + padding-left: 12px; + display: block; + text-decoration: none; + border-radius: 4px; + color: #070707; + transition: 0.3s; + cursor: pointer; +} + +.sidebar-nav-button:hover { + background-color: var(--primary-p75); + border-radius: 4px; +} + +.selected-nav { + color: white; + background-image: var(--gradient-purpleblue); + border-radius: 4px; + font-weight: 700; +} + +.sidebar-box { + width: 100%; + display: flex; + flex-direction: column; + background: white; + border: solid 1px var(--primary-p75); + border-radius: 8px; + padding: 8px; + gap: 8px; +} + +.sidebar-box-header { + display: flex; + padding: 8px 8px 16px; + flex-direction: column; + align-items: flex-start; + gap: 8px; + align-self: stretch; + border-bottom: 1px solid var(--primary-p-50, #ebf4f7); +} + +.sidebar-box * { + color: #070707; +} + +.sidebar-box nav { + display: flex; + flex-direction: column; + gap: 8px; +} + +.sidebar-box nav div { + border-radius: 4px; + display: flex; + padding: 8px 8px 8px 12px; + align-items: center; + gap: 8px; + align-self: stretch; + background-image: url("/images/icons/svgs/chevron-right-sidebar.svg"); + background-repeat: no-repeat; + background-position: right center; +} + +.bottom-note { + padding: 1.25rem 0.5rem 1rem 0.75rem; +} + +.bottom-note > p { + border-left: 0.1875rem solid var(--primary-p-300, #3792ad); + padding-left: 0.75rem; + padding-right: 0.75rem; +} + +@media (max-device-width: 768px), (width <= 768px) { + .left-col-inner { + margin-left: 0; + } + + .sidebar-nav p { + margin-bottom: 0; + } + + .mobile-chevron { + display: block; + width: 1.5rem; + height: 1.5rem; + } + + .sidebar-header { + display: flex; + padding: 0.5rem; + padding-top: 0.3rem; + justify-content: space-between; + } + + .sidebar-header p { + margin: 0; + } + + .sidebar-nav-container { + display: none; + } + + #header-sidebar-container { + margin-right: -2px; + display: block; + height: 4.5rem; + width: 100%; + background-color: #fff; + } + + .sidebar-nav { + margin-top: 1rem; + height: 1.7rem; + overflow: hidden; + transition: 0.3s; + margin-right: auto; + margin-left: auto; + border: 1.5px solid #0000; + border-radius: 8px; + width: calc(100vw - 5rem); + background: linear-gradient(white, white) padding-box, + var(--gradient-brand) border-box; + } + + .sidebar-nav.open { + height: calc(100% + 19rem); + } +} diff --git a/content/about.md b/content/about.md deleted file mode 100644 index 5f411ca1d..000000000 --- a/content/about.md +++ /dev/null @@ -1,164 +0,0 @@ -# _Bioconductor_ - -The mission of the Bioconductor project is to develop, support, and -disseminate free open source software that facilitates rigorous and -reproducible analysis of data from current and emerging biological assays. -We are dedicated to building a diverse, collaborative, and welcoming -community of developers and data scientists. - - -[Scientific][], [Technical][] and [Community][] -Advisory Boards provide project oversight. - -[R]: http://www.r-project.org -[Technical]: technical-advisory-board/ -[Scientific]: scientific-advisory-board/ -[Community]: community-advisory-board/ - - -## Release and core development - -The _Bioconductor_ [release version](/packages/release/bioc/) is updated -twice each year, and is appropriate for most users. There is also a -[development version](/packages/devel/bioc), to which new features and -packages are added prior to incorporation in the release. A large -number of [meta-data packages](/packages/release/data/annotation) -provide pathway, organism, microarray and other annotations. - -The _Bioconductor_ project started in 2001 and is overseen by a [core -team](/about/core-team/), based primarily at [Roswell Park Comprehensive Cancer -Center](https://www.roswellpark.org), and by other members coming -from US and international institutions. A [Community Advisory Board][Community] -and a [Technical Advisory Board][Technical] of key participants -meets monthly to support the _Bioconductor_ mission by coordinating -training and outreach activities, developing strategies to ensure long-term -technical suitability of core infrastructure, and to identify and enable -funding strategies for long-term viability. -A [Scientific Advisory Board][Scientific] including external -experts provides annual guidance and accountability. - -Key citations to the project include Huber et al., 2015 [Nature -Methods 12:115-121][1] and Gentleman et al., 2004 [Genome Biology -5:R80][2] - -[1]: http://www.nature.com/nmeth/journal/v12/n2/abs/nmeth.3252.html -[2]: https://genomebiology.biomedcentral.com/track/pdf/10.1186/gb-2004-5-10-r80.pdf - -## _Bioconductor_ Packages - -Most _Bioconductor_ components are distributed as [R -packages](http://cran.r-project.org/doc/FAQ/R-FAQ.html#R-Add_002dOn-Packages). -The functional scope of [Bioconductor packages](/packages/release/bioc/) -includes the analysis of DNA microarray, sequence, flow, SNP, and other data. - -## Project Goals - -The broad goals of the _Bioconductor_ project are: - -* To provide widespread access to a broad range of powerful statistical - and graphical methods for the analysis of genomic data. -* To facilitate the inclusion of biological metadata in the analysis of - genomic data, e.g. literature data from PubMed, annotation data from - Entrez genes. -* To provide a common software platform that enables the rapid development - and deployment of extensible, scalable, and interoperable software. -* To further scientific understanding by producing high-quality - [documentation](/help/package-vignettes/) and reproducible research. -* To [train](/help/course-materials/) researchers on computational and - statistical methods for the analysis of genomic data. - -## Main Project Features - -* **The R Project for Statistical Computing**. Using - [R](http://www.r-project.org) provides a broad range of advantages - to the _Bioconductor_ project, including: - * A high-level interpreted language to easily and quickly prototype - new computational methods. - * A well established system for packaging together software with - documentation. - * An object-oriented framework for addressing the diversity and - complexity of computational biology and bioinformatics problems. - * Access to on-line computational biology and bioinformatics data. - * Support for rich statistical simulation and modeling activities. - * Cutting edge data and model visualization capabilities. - * Active development by a dedicated team of researchers with a - strong commitment to good documentation and software design. - -* **Documentation and reproducible research**. Each [Bioconductor - package](/packages/release/bioc/) contains one or more - [vignettes](/help/package-vignettes/), documents that provide a - textual, task-oriented description of the package's functionality. - Vignettes come in several forms. Many are "HowTo"s that demonstrate - how a particular task can be accomplished with that package's software. - Others provide a more thorough overview of the package or discuss general - issues related to the package. - -* **Statistical and graphical methods**. The _Bioconductor_ project - provides access to powerful statistical and graphical methods for - the analysis of genomic data. - [Analysis packages](/packages/release/bioc/) address - [workflows](/packages/release/workflows/) for analysis of - oligonucleotide arrays, sequence analysis, flow cytometry. and other - high-throughput genomic data. The - [R package system](http://cran.r-project.org/doc/FAQ/R-FAQ.html#R-Add_002dOn-Packages) - itself provides implementations for a broad range of - state-of-the-art statistical and graphical techniques, including - linear and non-linear modeling, cluster analysis, prediction, - resampling, survival analysis, and time-series analysis. - -* **Annotation**. The _Bioconductor_ project provides software for - associating microarray and other genomic data in real time with - biological metadata from web databases such as GenBank, Entrez genes - and PubMed ([annotate](/packages/release/bioc/html/annotate.html) - package). Functions are also provided for incorporating the results - of statistical analysis in HTML reports with links to annotation web - resources. Software tools are available for assembling and - processing genomic annotation data, from databases such as GenBank, - the Gene Ontology Consortium, Entrez genes, UniGene, the UCSC Human - Genome Project - ([AnnotationDbi](/packages/release/bioc/html/AnnotationDbi.html) - package). [Annotation data packages](/packages/release/data/annotation/) - are distributed to provide mappings between different probe - identifiers (e.g. Affy IDs, Entrez genes, PubMed). Customized - annotation libraries can also be assembled. - -* **Bioconductor short courses**. The _Bioconductor_ project has developed a - program of [short courses](/help/course-materials/) on software and - statistical methods for the analysis of genomic data. Courses have been - given for audiences with backgrounds in either biology or statistics. All - [course materials](/help/course-materials/) (lectures and computer labs) - are available on this site. - -* **Open source**. The _Bioconductor_ project has a commitment to full - open source discipline, with distribution via a public git - (version control) server. Almost all contributions exist under an - open source license. There are many different reasons why open - source software is beneficial to the analysis of microarray data and - to computational biology in general. The reasons include: - * To provide full access to algorithms and their implementation - * To facilitate software improvements through bug fixing and software - extension - * To encourage good scientific computing and statistical practice by - providing appropriate tools and instruction - * To provide a workbench of tools that allow researchers to explore and - expand the methods used to analyze biological data - * To ensure that the international scientific community is the owner of - the software tools needed to carry out research - * To lead and encourage commercial support and development of those tools - that are successful - * To promote reproducible research by providing open and accessible tools - with which to carry out that research (reproducible research is distinct - from independent verification) - -* **Open development**. Users are encouraged to become developers, either - by contributing - [Bioconductor compliant packages](/developers/package-guidelines/) - or documentation. Additionally _Bioconductor_ provides a mechanism for - linking together different groups with common goals to foster - collaboration on software, often at the level of shared development. - -## Code of Conduct - -Please refer to the [Bioconductor Code of Conduct][coc] - -[coc]: code-of-conduct/ \ No newline at end of file diff --git a/content/about/annual-reports.html b/content/about/annual-reports.html index 25e629d86..8760f46e7 100644 --- a/content/about/annual-reports.html +++ b/content/about/annual-reports.html @@ -1,10 +1,10 @@ -

    Annual Reports

    +

    Annual Reports

    Project Annual Reports are available in PDF format for the following years:

    -
      +
        <% annual_reports.sort{|a, b| b[:name] <=> a[:name]}.select do |r| %>
      • <%= r[:name] %>
      • <% end %> diff --git a/content/about/awards.md b/content/about/awards.md index c724f041d..d77cdfb87 100644 --- a/content/about/awards.md +++ b/content/about/awards.md @@ -1,5 +1,4 @@ -# ![](/images/icons/magnifier.gif) Bioconductor Community Awards - +# Bioconductor Community Awards The Bioconductor project proudly launched in 2020 an initiative to honor contributions to the project. Each year, four awardees will be selected, each @@ -15,14 +14,13 @@ towards the selection of an awardee. Up to four awardees are selected in each call using the below criteria as justification. One award each year is dedicated to a junior developer or new package development. -* __Outstanding new package contributions__, for developers of high-quality packages, added to Bioconductor in one of the two most recent releases prior to the nomination deadline, showing exemplary use of the Bioconductor package design principles. -* __Outstanding support site contributions__, for individuals showing extraordinary helpfulness on the Bioconductor support site and/or in other forums. -* __Outstanding documentation contributions__, for individuals writing and maintaining excellent user-facing documentation, workflows and/or tutorials. -* __Outstanding community engagement and outreach__, for individuals who "make things happen", promote diversity, engage with and provide substantial contributions to the Bioconductor community. -* __Outstanding long-term contributions to the project__, for individuals who have provided excellent contributions in any form to the project over a substantial time period. -* __Outstanding contributions enabling computational analysis or representation of data from new scientific technologies__, for individuals who, via package development or other means, enable analysis of data from new scientific technologies within Bioconductor. -* __Outstanding contributions enabling the use of new informatic technologies within the project__, for individuals who, via package development or other means, enable the use of novel informatic technologies within Bioconductor. - +- **Outstanding new package contributions**, for developers of high-quality packages, added to Bioconductor in one of the two most recent releases prior to the nomination deadline, showing exemplary use of the Bioconductor package design principles. +- **Outstanding support site contributions**, for individuals showing extraordinary helpfulness on the Bioconductor support site and/or in other forums. +- **Outstanding documentation contributions**, for individuals writing and maintaining excellent user-facing documentation, workflows and/or tutorials. +- **Outstanding community engagement and outreach**, for individuals who "make things happen", promote diversity, engage with and provide substantial contributions to the Bioconductor community. +- **Outstanding long-term contributions to the project**, for individuals who have provided excellent contributions in any form to the project over a substantial time period. +- **Outstanding contributions enabling computational analysis or representation of data from new scientific technologies**, for individuals who, via package development or other means, enable analysis of data from new scientific technologies within Bioconductor. +- **Outstanding contributions enabling the use of new informatic technologies within the project**, for individuals who, via package development or other means, enable the use of novel informatic technologies within Bioconductor. All nominees suggested will be considered for the award. The nominations will be processed, and the awardees will be selected, by the current members of the @@ -31,51 +29,53 @@ active members of either of these boards are not eligible for an award. For more details about the selection process see the [Proceedures and Regulations](https://docs.google.com/document/d/1bHFoZS7kJoUh9ZOU2LwZaHwnJhradDmWcDV9EXJc8tI/edit?usp=sharing) +# How to nominate a person -# How to nominate a person In order to nominate someone for the awards, please fill out the nomination [Google Form](https://forms.gle/gPzmH8ewHNHWckdv6), with the following information: - -1. Your full name and e-mail address. -2. Full name and e-mail address of the nominee. -3. The relevant award criteria. -4. Motivation for the nomination and how the nominee satisfies the selected award criteria. + +1. Your full name and e-mail address. +2. Full name and e-mail address of the nominee. +3. The relevant award criteria. +4. Motivation for the nomination and how the nominee satisfies the selected award criteria. The form is available 3-4 months before the annual Bioconductor conference. It will be advertised on the conference website, Bioconductor social media platforms, and support site forums. If you are unable to fill out a google form, -please contact bioconductorcoreteam@gmail.com to nominate a candidate. +please contact bioconductorcoreteam@gmail.com to nominate a candidate. The deadline to nominate a candidate for the Bioc2023 Awards is Wednsday May 31 st, 2023. The Bioc2023 Awards will be announced during the -[annual conference](https://bioc2023.bioconductor.org/) August 2-4, 2023. - +[annual conference](https://bioc2023.bioconductor.org/) August 2-4, 2023. # FAQ -* __Am I allowed to nominate more than one person?__ -Yes. We appreciate it if you limit your nominations to no more than 3 people. -* __Can the same individual be awarded multiple times (in different years)?__ -Yes. However, it has to be clear that the contributions that the individual is recognized for are different and "new" contributions that occured after the previous award was granted. -* __Are self-nominations allowed?__ -No - +- **Am I allowed to nominate more than one person?** + Yes. We appreciate it if you limit your nominations to no more than 3 people. +- **Can the same individual be awarded multiple times (in different years)?** + Yes. However, it has to be clear that the contributions that the individual is recognized for are different and "new" contributions that occured after the previous award was granted. +- **Are self-nominations allowed?** + No # Important dates: -* Deadline for nominations: May 31, 2023. -* Notification about the awards: at the Bioconductor conference and via email, if the awardee does not attend the conference. +- Deadline for nominations: May 31, 2023. +- Notification about the awards: at the Bioconductor conference and via email, if the awardee does not attend the conference. # Awardees 2022 ## Sean Davis + ## Erica Feick + ## Nicole Kramer + ## Hervé Pagès + # Previous Winners @@ -85,11 +85,7 @@ No 2020: Helena Crowell, Aaron Lun, Lori Shepherd, Gordon Smyth # Questions -Questions can be addressed via email to cab(at)bioconductor.org - +Questions can be addressed via email to cab(at)bioconductor.org ![BiocAwards](/images/biocawards/BiocAward.png) - - - diff --git a/content/about/code-of-conduct.md b/content/about/code-of-conduct.md index 06499b9dd..87bb0eb4f 100644 --- a/content/about/code-of-conduct.md +++ b/content/about/code-of-conduct.md @@ -1,4 +1,4 @@ -# ![](/images/icons/magnifier.gif) Project-wide Code of Conduct statement for Bioconductor +# Project-wide Code of Conduct statement for Bioconductor The Code of Conduct has moved to [GitHub Pages][1] (preview below). diff --git a/content/about/community-advisory-board.md b/content/about/community-advisory-board.md index 11777e0e7..c2c7a109d 100644 --- a/content/about/community-advisory-board.md +++ b/content/about/community-advisory-board.md @@ -1,7 +1,8 @@ -# ![](/images/icons/magnifier.gif)Community Advisory Board +# Community Advisory Board -The Community Advisory Board purpose is to support the _Bioconductor_ +The Community Advisory Board purpose is to support the Bioconductor mission by: + - Empowering user and developer communities by coordinating training and outreach activities. - Enabling productive and respectful participation by Bioconductor users and developers at all levels of experience. @@ -9,196 +10,125 @@ The Community Advisory Board governance document ([PDF][1]) outlines membership, [1]: CAB-Governance.pdf -Quick Links --------- - -* [Current Members](#current-members) -* [FAQ](#faq) -* [Meeting Minutes](#meeting-minutes) -* [Event Calendar](#event-calendar) -* [Contact](#contact) -* [Past Members](#past-members) +## Quick Links +- [Current Members](#current-members) +- [FAQ](#faq) +- [Meeting Minutes](#meeting-minutes) +- [Event Calendar](#event-calendar) +- [Contact](#contact) +- [Past Members](#past-members) ## Current members + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        - Enis Afgan -
        Enis Afgan, Johns Hopkins University, USA. - LinkedIn -
        -
        - Umar Ahmad -
        Umar Ahmad, Bauchi State University, Gadau, Nigeria and Africa CDC. - LinkedIn -
        -
        - Daniela Cassol -
        Daniela Cassol, University of California, Riverside, USA. - Website -
        -
        - Aedin Culhane -
        Aedin Culhane, University of Limerick, Ireland. - Website -
        -
        - Xueyi Dong -
        Xueyi Dong, Walter and Eliza Hall Institute of Medical Research, Australia. - Linkedin -
        -
        - Maria Doyle -
        Maria Doyle, University of Limerick, Ireland. - Linkedin -
        -
        - Lori (Shepherd) Kern -
        Lori (Shepherd) Kern, Roswell Park Comprehensive Cancer Center, USA. - Linkedin -
        -
        - Leo Lahti -
        Leo Lahti, University of Turku, Finland. - Website -
        -
        - Mengbo Li -
        Mengbo Li, Walter and Eliza Hall Institute of Medical Research (WEHI), Australia. - LinkedIn -
        -
        - Estefania Mancini -
        Estefania Mancini, Centre for Genomic Regulation, Spain. - Google Scholar -
        -
        - Jordana Muwanguzi -
        Jordana Muwanguzi, Northeastern University, USA - LinkedIn -
        -
        - Kozo Nishida -
        Kozo Nishida, Tokyo University of Agriculture and Technology, Japan. - Github -
        -
        - Nicole Ortogero -
        Nicole Ortogero, NanoString Technologies, USA. - Linkedin -
        -
        - Stevie Pederson -
        Stevie Pederson, Telethon Kids Institute, Australia - Website -
        -
        - Johannes Rainer -
        Johannes Rainer, Eurac Research, Italy. - Website -
        -
        - Janani Ravi -
        Janani Ravi, University of Colorado Anschutz, USA. - Webpage -
        -
        - Kevin Rue-Albrecht -
        Kevin Rue-Albrecht, University of Oxford, UK. - Website -
        -
        - Mike Smith -
        Mike Smith, EMBL, Germany. - Website -
        -
        - Luyi Tian -
        Luyi Tian, Guangzhou Laboratory, China. - Twitter -
        -
        - Hedia Tnani -
        Hedia Tnani, CNAG, Spain. - Linkedin -
        -
        - Jiefei Wang -
        Jiefei Wang,University of Texas Medical Branch, USA. - GitHub -
        -
        - -The current co-chairs are Kevin Rue-Albrecht and Janani Ravi.
        -The current secretary is Johannes Rainer.
        -The current Bioconductor Community Manager is Maria Doyle. + ## FAQ + The following Q&As are from [Meet the Community Advisory Board CAB](https://www.youtube.com/watch?v=LTT1i_ACpxc) in [BioC2021](https://bioc2021.bioconductor.org/). If you have any other questions, please click [this link](https://github.com/BioconductorBoards/CABWorkingGroups/discussions/new) to ask a question. (You need to be signed in to [GitHub](https://github.com/) to open the new question.) @@ -206,6 +136,7 @@ In addition to asking new questions, you can also continue the discussion follow [github.com/BioconductorBoards/CABWorkingGroups/discussions/categories/q-a](https://github.com/BioconductorBoards/CABWorkingGroups/discussions/categories/q-a). ### How do I join the CAB? + There is an annual expression of interest process inviting new members to apply to join the CAB. This is announced on the Bioconductor support site and relevant Bioconductor community slack channel. Current CAB members vote on the applications received to select new members. The board is keen to have representatives from diverse backgrounds (i.e. different geographical and cultural backgrounds, genders, statistical analysis interests, career stages and experience levels). Also: Community members interested but not elected to CAB, or that would like more specialized work would be encouraged to volunteer to be part of a working group organized by the CAB/TAB -- there is a soon to be released page where we will list the active and inactive (needing someone to lead) working groups and for community members to suggest working groups. @@ -213,42 +144,52 @@ Nominations for 2023 CAB board members is occurring now. Please fill out the following [google form](https://forms.gle/2nb2fJE4jgca3nqi7). If you are unable to use google forms please see the follow [pdf of questions](NominationFormQuesetions.pdf) and email responses to -shepherd.bioc@gmail.com. +shepherd.bioc@gmail.com. ### Is there a recommended way for community members to give suggestions to the CAB? + We are happy to receive suggestions and feedback and recommend reaching us via email (cab@bioconductor.org) or by messaging us on the #community-advisory-board channel of the Bioconductor community slack ([slack.bioconductor.org](https://slack.bioconductor.org/)). (See also: A for the previous Q.) ### Are there any big new CAB projects or plans on the horizon? + We plan to redevelop the Bioconductor website to make it easier to navigate and use on different devices and also develop new training resources aligned with the Carpentries project ([chanzuckerberg.com/eoss/proposals/bioconductor-high-quality-training-and-support-for-a-worldwide-community](https://chanzuckerberg.com/eoss/proposals/bioconductor-high-quality-training-and-support-for-a-worldwide-community/)). Hosting a BioC Africa meeting in the future to compliment the annual meetings that are run in other parts of the world is another ambition. ### What projects are you working on currently -The Bioconductor community manager Dr. Maria Doyle is leading the CZI EOSS funded [training and website iniatives](chanzuckerberg.com/eoss/proposals/bioconductor-high-quality-training-and-support-for-a-worldwide-community) and CAB members are participating with [working groups](https://workinggroups.bioconductor.org). Everyone is welcome to join a [working group](https://workinggroups.bioconductor.org) and contribute to our community. + +The Bioconductor community manager Dr. Maria Doyle is leading the CZI EOSS funded [training and website iniatives](chanzuckerberg.com/eoss/proposals/bioconductor-high-quality-training-and-support-for-a-worldwide-community) and CAB members are participating with [working groups](https://workinggroups.bioconductor.org). Everyone is welcome to join a [working group](https://workinggroups.bioconductor.org) and contribute to our community. ### What did you consider the biggest challenges when joining the CAB as a new member? + Securing funding to increase the effort that can be put in to different activities. ### Can we contribute to CAB activities or organize other ones even if we’re not on the CAB? + Yes, anyone is free to contribute to the organisation of community events or other CAB initiatives. For instance, there is an annual call for people to join the BioC conference organising committee, which is a great way to get involved and meet new people. ### Do you have current or future plans to collaborate with other R community groups? e.g. R-ladies? + Yes. A number of CAB members are already connected to various R-Ladies groups, having been involved in their establishment or as active participants in different parts of the world (including the USA and Australia). ### How much time commitment is involved in being a member of the CAB? + It depends how involved you are in different activities, and may fluctuate throughout the year, but on average, it can take up around 1 day per month. There is a recurring monthly board meeting that runs for 1 hour that all members attend. ### How experienced does someone need to be to join Bioconductor’s CAB? + The goal is for the board to broadly reflect the diversity of users and developers in the Bioconductor community, so we would encourage people of all career stages and experience levels to consider applying if you are interested in contributing to our community development efforts. ### Would there be an opportunity to visit one of the CAB meetings before being part of it? + Guests are most welcome to attend a meeting to see what it is about - just get in touch and we can arrange attendance. To see what has been discussed at past meetings, you can find the Meeting minutes. ## Meeting minutes + The Community Advisory Board meets monthly. Minutes of the last meeting are made available after being approved by the board at the following meeting. The first meeting for which public minutes were maintained was on 9 April, 2020. -- **2023:** [2023-05-11](2023-05-11-minutes.pdf), [2023-04-13](2023-04-13-minutes.pdf), [2023-03-09](2023-03-09-minutes.pdf), [2023-02-09](2023-02-09-minutes.pdf), [2023-01-12](2023-01-12-minutes.pdf) -- **2022:** [2022-12-08](2022-12-08-minutes.pdf), [2022-11-10](2022-11-10-minutes.pdf), [2022-10-12](2022-10-12-cab-tab-joint-meeting-minutes.pdf) Joint CAB/TAB meeting, [2022-09-08](2022-09-08-minutes.pdf), [2022-08-11](2022-08-11-minutes.pdf), [2022-07-14](2022-07-14-minutes.pdf), [2022-06-09](2022-06-09-minutes.pdf), [2022-05-12](2022-05-12-minutes.pdf), [2022-04-14](2022-04-14-minutes.pdf), [2022-03-10](2022-03-10-minutes.pdf), [2022-02-10](2022-02-10-minutes.pdf), [2022-01-13](2022-01-13-minutes.pdf) +- **2023:** [2023-05-11](2023-05-11-minutes.pdf), [2023-04-13](2023-04-13-minutes.pdf), [2023-03-09](2023-03-09-minutes.pdf), [2023-02-09](2023-02-09-minutes.pdf), [2023-01-12](2023-01-12-minutes.pdf) +- **2022:** [2022-12-08](2022-12-08-minutes.pdf), [2022-11-10](2022-11-10-minutes.pdf), [2022-10-12](2022-10-12-cab-tab-joint-meeting-minutes.pdf) Joint CAB/TAB meeting, [2022-09-08](2022-09-08-minutes.pdf), [2022-08-11](2022-08-11-minutes.pdf), [2022-07-14](2022-07-14-minutes.pdf), [2022-06-09](2022-06-09-minutes.pdf), [2022-05-12](2022-05-12-minutes.pdf), [2022-04-14](2022-04-14-minutes.pdf), [2022-03-10](2022-03-10-minutes.pdf), [2022-02-10](2022-02-10-minutes.pdf), [2022-01-13](2022-01-13-minutes.pdf) - **2021:** [2021-12-09](2021-12-09-minutes.pdf), [2021-11-11](2021-11-11-minutes.pdf), [2021-10-14](2021-10-14-cab-tab-joint-meeting-minutes.pdf) Joint CAB/TAB meeting, @@ -278,7 +219,7 @@ The [Bioconductor Event Calendar](https://calendar.google.com/calendar/b/1?cid=YWtlczFvZGVsbW9kcDAzODV1ZHB2NDhpY29AZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ) is a public facing google calendar for Bioconductor and Bioconductor related events. The events posted on this calendar are managed by members of the -Community Advisory Board. If you would like an event added to the calendar +Community Advisory Board. If you would like an event added to the calendar please submit [this GitHub issue form](https://github.com/BioconductorBoards/CABWorkingGroups/issues/new?assignees=kozo2&labels=event%2Ccalendar&template=EVENT-CALENDAR.yml&title=%5BEvent%5D%3A+REPLACE+ME+WITH+YOUR+EVENT+TITLE) (You have to be signed in to [GitHub](https://github.com/) to see the form link.) Any additional questions or if you do not have a github account please @@ -286,13 +227,14 @@ email events at bioconductor.org ## Contact -If you would like to contact the Community Advisory Board please email: cab at bioconductor.org +If you would like to contact the Community Advisory Board please email: cab at bioconductor.org ![Community Advisory Board](/images/cab/cab.png) -There is also a community-advisory-board channel on the [Bioconductor community slack](https://slack.bioconductor.org/) +There is also a community-advisory-board channel on the [Bioconductor community slack](https://slack.bioconductor.org/) ## Past Members + We are grateful to past CAB members;
          @@ -306,20 +248,16 @@ We are grateful to past CAB members;
        - - - - -[1.1]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/twitter-24x24.png (twitter icon without padding) -[1.2]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/github-24x24.png (github icon without padding) -[1.3]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/google%2B-24x24.png (google plus icon without padding) -[1.4]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/linkedin-24x24.png (icon for linkedin which I need to get) -[1.5]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/vcard-24x24.png (vard) +[1.1]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/twitter-24x24.png "twitter icon without padding" +[1.2]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/github-24x24.png "github icon without padding" +[1.3]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/google%2B-24x24.png "google plus icon without padding" +[1.4]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/linkedin-24x24.png "icon for linkedin which I need to get" +[1.5]: https://github.com/paulrobertlloyd/socialmediaicons/blob/main/vcard-24x24.png "vard" diff --git a/content/about/core-team.md b/content/about/core-team.md index 727039cb5..38b933506 100644 --- a/content/about/core-team.md +++ b/content/about/core-team.md @@ -1,75 +1,66 @@ -# ![](/images/icons/magnifier.gif)Core Team +# Core Team ## Current and Recent Members - - - - - - - - - - - - - - - - - - -
        - Vince Carey -
        Vince Carey (Project Lead) -
        - Kayla Interdonato -
        Kayla Interdonato -
        - Lori (Shepherd) Kern -
        Lori Ann (Shepherd) Kern -
        - Alexandru Mahmoud -
        Alexandru Mahmoud -
        - Herve Pages -
        Hervé Pagès -
        - Marcel Ramos -
        Marcel Ramos -
        - Robert Shear -
        Robert Shear -
        - Jennifer Wokaty -
        Jennifer Wokaty -
        -
        + Alumni -* Nitesh Turaga -* Jiefei Wang -* Martin Morgan -* Daniel van Twisk -* Qian Liu -* Valerie Obenchain -* Greg Wargula -* Dan Tenenbaum -* Brian Long -* Jim Hester -* Jim Java -* Marc Carlson -* Nathaniel Hayden -* Paul Shannon -* Sonali Arora - +- Nitesh Turaga +- Jiefei Wang +- Martin Morgan +- Daniel van Twisk +- Qian Liu +- Valerie Obenchain +- Greg Wargula +- Dan Tenenbaum +- Brian Long +- Jim Hester +- Jim Java +- Marc Carlson +- Nathaniel Hayden +- Paul Shannon +- Sonali Arora diff --git a/content/about/european-bioconductor-society.md b/content/about/european-bioconductor-society.md index a087ee73b..441fd5436 100644 --- a/content/about/european-bioconductor-society.md +++ b/content/about/european-bioconductor-society.md @@ -1,34 +1,26 @@ -# ![](/images/icons/magnifier.gif)European Bioconductor Society e.V. +# European Bioconductor Society e.V. - - - - - - - -
        The European Bioconductor Society e.V. is a registered association in Germany, founded in December 2021, with the intention to support Bioconductor's mission to promote open source software in the life sciences and statistics. The society aims to facilitate the organisation and logistics of Bioconductor associated conferences, workshops, and training events across Europe. European Bioconductor Society Logo
        +
        +

        The European Bioconductor Society e.V. is a registered association in Germany, founded in December 2021, with the intention to support Bioconductor's mission to promote open source software in the life sciences and statistics. The society aims to facilitate the organisation and logistics of Bioconductor associated conferences, workshops, and training events across Europe.

        + European Bioconductor Society Logo +
        # Organisation -| **Chair:** Dr. Wolfgang Huber | -| **Deputy Chairs:** Dr. Charlotte Soneson and Prof. Laurent Gatto | -| **Treasurer and Secretary:** Simone Bell | +**Chair:** Dr. Wolfgang Huber
        +**Deputy Chairs:** Dr. Charlotte Soneson and Prof. Laurent Gatto
        +**Treasurer and Secretary:** Simone Bell # Contact details ## Postal Address -| European Bioconductor Society e.V. | -| c/o Simone Bell | -| Postfach 1140 | -| 68799 Reilingen | -| Germany | +European Bioconductor Society e.V.
        +c/o Simone Bell
        +Postfach 1140
        +68799 Reilingen
        +Germany
        ## Email -| simone.bell (at) embl.de | - - - - +simone.bell (at) embl.de diff --git a/content/about/index.md b/content/about/index.md new file mode 100644 index 000000000..4c813bd87 --- /dev/null +++ b/content/about/index.md @@ -0,0 +1,176 @@ +# About Bioconductor + +The mission of the Bioconductor project is to develop, support, and +disseminate free open source software that facilitates rigorous and +reproducible analysis of data from current and emerging biological assays. +We are dedicated to building a diverse, collaborative, and welcoming +community of developers and data scientists. + +[Scientific][], [Technical][] and [Community][] +Advisory Boards provide project oversight. + +[R]: http://www.r-project.org +[Technical]: technical-advisory-board/ +[Scientific]: scientific-advisory-board/ +[Community]: community-advisory-board/ + +## Release and core development + +The Bioconductor [release version](/packages/release/bioc/) is updated +twice each year, and is appropriate for most users. There is also a +[development version](/packages/devel/bioc), to which new features and +packages are added prior to incorporation in the release. A large +number of [meta-data packages](/packages/release/data/annotation) +provide pathway, organism, microarray and other annotations. + +The Bioconductorproject started in 2001 and is overseen by a [core +team](/about/core-team/), based primarily at [Roswell Park Comprehensive Cancer +Center](https://www.roswellpark.org), and by other members coming +from US and international institutions. A [Community Advisory Board][Community] +and a [Technical Advisory Board][Technical] of key participants +meets monthly to support the Bioconductor mission by coordinating +training and outreach activities, developing strategies to ensure long-term +technical suitability of core infrastructure, and to identify and enable +funding strategies for long-term viability. +A [Scientific Advisory Board][Scientific] including external +experts provides annual guidance and accountability. + +Key citations to the project include Huber et al., 2015 [Nature +Methods 12:115-121][1] and Gentleman et al., 2004 [Genome Biology +5:R80][2] + +[1]: http://www.nature.com/nmeth/journal/v12/n2/abs/nmeth.3252.html +[2]: https://genomebiology.biomedcentral.com/track/pdf/10.1186/gb-2004-5-10-r80.pdf + +
        + <%= render('/components/homepage/join/') %> +
        + +## Bioconductor Packages + +Most Bioconductor components are distributed as [R +packages](http://cran.r-project.org/doc/FAQ/R-FAQ.html#R-Add_002dOn-Packages). +The functional scope of [Bioconductor packages](/packages/release/bioc/) +includes the analysis of DNA microarray, sequence, flow, SNP, and other data. + +## Project Goals + +The broad goals of the Bioconductor project are: + +- To provide widespread access to a broad range of powerful statistical + and graphical methods for the analysis of genomic data. +- To facilitate the inclusion of biological metadata in the analysis of + genomic data, e.g. literature data from PubMed, annotation data from + Entrez genes. +- To provide a common software platform that enables the rapid development + and deployment of extensible, scalable, and interoperable software. +- To further scientific understanding by producing high-quality + [documentation](/help/package-vignettes/) and reproducible research. +- To [train](/help/course-materials/) researchers on computational and + statistical methods for the analysis of genomic data. + +## Main Project Features + +The R project for Statistical Computing. Using +[R](http://www.r-project.org) provides a broad range of advantages +to the Bioconductor project, including: + +- A high-level interpreted language to easily and quickly prototype + new computational methods. +- A well established system for packaging together software with + documentation. +- An object-oriented framework for addressing the diversity and + complexity of computational biology and bioinformatics problems. +- Access to on-line computational biology and bioinformatics data. +- Support for rich statistical simulation and modeling activities. +- Cutting edge data and model visualization capabilities. +- Active development by a dedicated team of researchers with a + strong commitment to good documentation and software design. + +#### Documentation and reproducible research + +Each [Bioconductor package](/packages/release/bioc/) contains one or more +[vignettes](/help/package-vignettes/), documents that provide a +textual, task-oriented description of the package's functionality. +Vignettes come in several forms. Many are "HowTo"s that demonstrate +how a particular task can be accomplished with that package's software. +Others provide a more thorough overview of the package or discuss general +issues related to the package. + +#### Statistical and graphical methods + +The Bioconductor project provides access to powerful statistical and graphical methods for +the analysis of genomic data. +[Analysis packages](/packages/release/bioc/) address +[workflows](/packages/release/workflows/) for analysis of +oligonucleotide arrays, sequence analysis, flow cytometry. and other +high-throughput genomic data. The +[R package system](http://cran.r-project.org/doc/FAQ/R-FAQ.html#R-Add_002dOn-Packages) +itself provides implementations for a broad range of +state-of-the-art statistical and graphical techniques, including +linear and non-linear modeling, cluster analysis, prediction, +resampling, survival analysis, and time-series analysis. + +#### Annotation + +The Bioconductor project provides software for associating microarray and other genomic +data in real time with biological metadata from web databases such as GenBank, Entrez genes +and PubMed ([annotate](/packages/release/bioc/html/annotate.html) +package). Functions are also provided for incorporating the results +of statistical analysis in HTML reports with links to annotation web +resources. Software tools are available for assembling and +processing genomic annotation data, from databases such as GenBank, +the Gene Ontology Consortium, Entrez genes, UniGene, the UCSC Human +Genome Project +([AnnotationDbi](/packages/release/bioc/html/AnnotationDbi.html) +package). [Annotation data packages](/packages/release/data/annotation/) +are distributed to provide mappings between different probe +identifiers (e.g. Affy IDs, Entrez genes, PubMed). Customized +annotation libraries can also be assembled. + +#### Bioconductor short courses + +The Bioconductor project has developed a +program of [short courses](/help/course-materials/) on software and +statistical methods for the analysis of genomic data. Courses have been +given for audiences with backgrounds in either biology or statistics. All +[course materials](/help/course-materials/) (lectures and computer labs) +are available on this site. + +#### Open source + +The Bioconductor project has a commitment to full +open source discipline, with distribution via a public git +(version control) server. Almost all contributions exist under an +open source license. There are many different reasons why open +source software is beneficial to the analysis of microarray data and +to computational biology in general. The reasons include: + +- To provide full access to algorithms and their implementation +- To facilitate software improvements through bug fixing and software + extension +- To encourage good scientific computing and statistical practice by + providing appropriate tools and instruction +- To provide a workbench of tools that allow researchers to explore and + expand the methods used to analyze biological data +- To ensure that the international scientific community is the owner of + the software tools needed to carry out research +- To lead and encourage commercial support and development of those tools + that are successful +- To promote reproducible research by providing open and accessible tools + with which to carry out that research (reproducible research is distinct + from independent verification) + +#### Open development + +Users are encouraged to become developers, either by contributing +[Bioconductor compliant packages](/developers/package-guidelines/) +or documentation. Additionally Bioconductor provides a mechanism for +linking together different groups with common goals to foster +collaboration on software, often at the level of shared development. + +## Code of Conduct + +Please refer to the [Bioconductor Code of Conduct][coc] + +[coc]: code-of-conduct/ diff --git a/content/about.yaml b/content/about/index.yaml similarity index 100% rename from content/about.yaml rename to content/about/index.yaml diff --git a/content/about/mirrors.md b/content/about/mirrors.md index 240f9cdad..1035f2b16 100644 --- a/content/about/mirrors.md +++ b/content/about/mirrors.md @@ -1,4 +1,4 @@ -![](/images/icons/magnifier.gif)Mirrors +Mirrors ======================================= If you are interested in maintaining a mirror of this site (for either diff --git a/content/about/mirrors/mirror-how-to.md b/content/about/mirrors/mirror-how-to.md index 090232c40..7962e8187 100644 --- a/content/about/mirrors/mirror-how-to.md +++ b/content/about/mirrors/mirror-how-to.md @@ -1,6 +1,6 @@ -# ![](/images/icons/magnifier.gif)How to mirror Bioconductor repository # +# How to mirror Bioconductor repository # -Bioconductor package repositories may be mirrored with `rsync`. This +Bioconductor package repositories may be mirrored with `rsync` This is appropriate if you or your user community requires frequent local access to many packages, where access to the main repository would be expensive or impossible (e.g., because users can only access diff --git a/content/about/package-reviewers.md b/content/about/package-reviewers.md index c0ac03a5e..6c2dccd96 100644 --- a/content/about/package-reviewers.md +++ b/content/about/package-reviewers.md @@ -1,4 +1,4 @@ -# ![](/images/icons/magnifier.gif) Package Reviewers +# Package Reviewers This page is in recognition to members of the community who have volunteered to assist with the review of newly submitted packages to Bioconductor. Anyone from @@ -14,7 +14,6 @@ submitted packages must abide by the Bioconductor [Code of Conduct][]. [Packages Under Review]: https://github.com/Bioconductor/Contributions/issues [Code of Conduct]: https://bioconductor.org/about/code-of-conduct/ - ## Package Reviewers
          @@ -31,13 +30,12 @@ submitted packages must abide by the Bioconductor [Code of Conduct][].
        • Lori Shepherd*
        • Dario Strbenac
        • Luke Zappia
        • - -*Current Package Review Administrators -
        -## Past Package Reviewers +

        *Current Package Review Administrators

        +## Past Package Reviewers +
        • Martin Morgan
        • Nitesh Turaga
        • - +
        diff --git a/content/about/related-projects.md b/content/about/related-projects.md index 35310c204..aa9ed0938 100644 --- a/content/about/related-projects.md +++ b/content/about/related-projects.md @@ -1,26 +1,26 @@ -# ![](/images/icons/magnifier.gif)Related Projects +# Related Projects ## R Related Projects -* [The R Project for Statistical Computing](http://www.r-project.org/) -* [The Comprehensive R Archive Network (CRAN)](http://cran.r-project.org/) -* [The Omega Project for Statistical Computing](http://www.omegahat.org/) -* [ROpenSci](https://ropensci.org/) +- [The R Project for Statistical Computing](http://www.r-project.org/) +- [The Comprehensive R Archive Network (CRAN)](http://cran.r-project.org/) +- [The Omega Project for Statistical Computing](http://www.omegahat.org/) +- [ROpenSci](https://ropensci.org/) ## Other Related Projects -* [BioJava](http://biojava.org/) -* [BioPerl](http://bio.perl.org/) -* [BioPython](http://biopython.org/) -* [Cancer Genomics](http://www.broad.mit.edu/cancer/), The Broad Institute / MIT +- [BioJava](http://biojava.org/) +- [BioPerl](http://bio.perl.org/) +- [BioPython](http://biopython.org/) +- [Cancer Genomics](http://www.broad.mit.edu/cancer/), The Broad Institute / MIT Genome Center -* [Cytoscape](http://www.cytoscape.org) -* [DNA-Chip Analyzer (dChip)](http://www.dchip.org), Harvard School of Public +- [Cytoscape](http://www.cytoscape.org) +- [DNA-Chip Analyzer (dChip)](http://www.dchip.org), Harvard School of Public Health -* [GenePattern](http://www.broad.mit.edu/cancer/software/genepattern/), The +- [GenePattern](http://www.broad.mit.edu/cancer/software/genepattern/), The Broad Institute/MIT Genome Center -* [Gifi Array Analyzer](http://www.stanford.edu/group/wonglab/software.html) -* [NetAffx Analysis Center](http://www.affymetrix.com/analysis/index.affx) -* [Reactome](http://www.reactome.org/) -* [S+ArrayAnalyzer](http://spotfire.tibco.com), +- [Gifi Array Analyzer](http://www.stanford.edu/group/wonglab/software.html) +- [NetAffx Analysis Center](http://www.affymetrix.com/analysis/index.affx) +- [Reactome](http://www.reactome.org/) +- [S+ArrayAnalyzer](http://spotfire.tibco.com), (port of Bioconductor software into S-PLUS by TIBCO Spotfire) diff --git a/content/about/scientific-advisory-board.md b/content/about/scientific-advisory-board.md index 699252b25..fc3d03339 100644 --- a/content/about/scientific-advisory-board.md +++ b/content/about/scientific-advisory-board.md @@ -1,4 +1,4 @@ -# ![](/images/icons/magnifier.gif)Scientific Advisory Board +# Scientific Advisory Board The Scientific Advisory Board provides external guidance and oversight of the scientific direction of the project. The Scientific Advisory @@ -6,19 +6,19 @@ Board is composed of leaders in the statistical analysis of high-throughput genomic data. Board members participate for a flexible term. Current members are: -* Robert Gentleman (Advisory Board Chair, Harvard Medical School) -* Rafael Irizarry (Dana Farber Cancer Institute) -* Vincent Carey (Brigham & Women's) -* Chris Wellington (NHGRI) -* Wolfgang Huber (European Molecular Biology Laboratory) -* Martin Morgan (Roswell Park Comprehensive Cancer Institute) -* Benjamin Neale (Broad Institute) -* Michael Schatz (Johns Hopkins University) -* Aviv Regev (Genentech Research and Early Development) -* Sandrine Dudoit (University of California, Berkeley) -* John Marioni (European Molecular Bioinformatics Laboratory) -* Daniela M Witten (University of Washington) -* Barbara Engelhardt (Princeton University) -* Susan Holmes (Stanford University) -* Benilton Carvalho (Universidade Estadual de Campinas, Brazil) -* Jay Shendure (Unversity of Washington) \ No newline at end of file +- Robert Gentleman (Advisory Board Chair, Harvard Medical School) +- Rafael Irizarry (Dana Farber Cancer Institute) +- Vincent Carey (Brigham & Women's) +- Chris Wellington (NHGRI) +- Wolfgang Huber (European Molecular Biology Laboratory) +- Martin Morgan (Roswell Park Comprehensive Cancer Institute) +- Benjamin Neale (Broad Institute) +- Michael Schatz (Johns Hopkins University) +- Aviv Regev (Genentech Research and Early Development) +- Sandrine Dudoit (University of California, Berkeley) +- John Marioni (European Molecular Bioinformatics Laboratory) +- Daniela M Witten (University of Washington) +- Barbara Engelhardt (Princeton University) +- Susan Holmes (Stanford University) +- Benilton Carvalho (Universidade Estadual de Campinas, Brazil) +- Jay Shendure (Unversity of Washington) diff --git a/content/about/technical-advisory-board.md b/content/about/technical-advisory-board.md index 75729176f..1d079c244 100644 --- a/content/about/technical-advisory-board.md +++ b/content/about/technical-advisory-board.md @@ -1,4 +1,4 @@ -# ![](/images/icons/magnifier.gif)Technical Advisory Board +# Technical Advisory Board The Technical Advisory Board purpose is to support the _Bioconductor_ mission by @@ -21,145 +21,86 @@ board. Governance was formalized in February, 2019. ## Current members - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        - Vince Carey -
        Vince Carey, Brigham & Women’s, Harvard Medical School, USA. Chair. - Website -
        -
        - Levi Waldron -
        Levi Waldron, CUNY Graduate School of Public Health and Health Policy, New York, NY. Vice-Chair - Website -
        -
        - Charlotte Soneson -
        Charlotte Soneson, Friedrich Miescher Institute for Biomedical Research, Basel, Switzerland. Secretary. - Website -
        -
        - Aedin Culhane -
        Aedin Culhane, University of Limerick, Ireland. - Website -
        -
        - Sean Davis -
        Sean Davis, University of Colorado Anschutz School of Medicine, USA. - Website -
        -
        - Laurent Gatto -
        Laurent Gatto, Institut de Duve, Belgium. - Website -
        -
        - Robert Gentleman -
        Robert Gentleman, Harvard Medical School, Boston, USA. - Website -
        -
        - Shila Ghazanfar -
        Shila Ghazanfar, University of Sydney, Australia. - Website -
        -
        - Kasper Daniel Hansen -
        Kasper Daniel Hansen, Bloomberg School of Public Health, Johns Hopkins University. - Website -
        -
        - Stephanie Hicks -
        Stephanie Hicks, Department of Biostatistics, Johns Hopkins Bloomberg School of Public Health, USA. - Website -
        -
        + - Rafael Irizarry -
        Rafael Irizarry, Dana-Farber Cancer Institute, USA - Website -
        -
        - Lori (Shepherd) Kern -
        Lori (Shepherd) Kern, Roswell Park Comprehensive Cancer Center, Buffalo, NY, USA. - Website
        -
        - Michael Love -
        Michael Love, University of North Carolina-Chapel Hill, USA. - Website -
        -
        - Davide Risso -
        Davide Risso, University of Padova, Italy. - Website -
        -
        - - - + alt="Wolfgang Huber" title="Wolfgang Huber"/> + Wolfgang Huber, European Molecular Biology Laboratory, Heidelberg, Germany + + + + + + + ## Meeting minutes @@ -189,7 +130,7 @@ minutes were maintained was on 2 May, 2019. [2021-11-04](2021-11-04-minutes.pdf), [2021-10-07](2021-10-07-minutes.pdf), [2021-09-02](2021-09-02-minutes.pdf), - (no August meeting), + (no August meeting), [2021-07-01](2021-07-01-minutes.pdf), [2021-06-03](2021-06-03-minutes.pdf), [2021-05-06](2021-05-06-minutes.pdf), @@ -211,16 +152,14 @@ minutes were maintained was on 2 May, 2019. - [2019-12-05](2019-12-05-minutes.pdf), [2019-11-07](2019-11-07-minutes.pdf), [2019-10-03](2019-10-03-minutes.pdf), - [2019-09-05](2019-09-05-minutes.pdf), - [2019-08-01](2019-08-01-minutes.pdf), + [2019-09-05](2019-09-05-minutes.pdf), + [2019-08-01](2019-08-01-minutes.pdf), [2019-07-10](2019-07-10-minutes.pdf), - [2019-06-06](2019-06-06-minutes.pdf), + [2019-06-06](2019-06-06-minutes.pdf), [2019-05-02](2019-05-02-minutes.pdf) - - + ## Contact -If you would like to contact the Technical Advisory Board please reach out to us on the Bioconductor slack +If you would like to contact the Technical Advisory Board please reach out to us on the Bioconductor slack ![Technical Advisory Board](/images/tab/tab.png) - diff --git a/content/developers.yaml b/content/developers.yaml deleted file mode 100755 index 09084f5e1..000000000 --- a/content/developers.yaml +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Developers -suppress_subnav: true -subnav: - - include: /_package_build_reports_and_svn/ - - include: /_bioc_devel_packages/ - diff --git a/content/developers/index.html b/content/developers/index.html new file mode 100644 index 000000000..0c33829ab --- /dev/null +++ b/content/developers/index.html @@ -0,0 +1,239 @@ +

        Developers

        +
        +
        +
        +

        Contributing packages

        +

        + Bioconductor is an open development project, meaning that all developers + from the scientific community are able to contribute software. Listed + here are helpful links which will guide developers at different stages + of their package. +

        +
        + + +
        +
        +
        +
        +
        + + + +
        + +
        + +
        + +
        + +
        +
        +
        + + + + Join Bioconductor on Slack, and meet hundreds of other developers! + +
        diff --git a/content/developers/index.yaml b/content/developers/index.yaml new file mode 100755 index 000000000..af28cc079 --- /dev/null +++ b/content/developers/index.yaml @@ -0,0 +1,6 @@ +--- +title: Developers +# suppress_subnav: true +# subnav: +# - include: /_package_build_reports_and_svn/ +# - include: /_bioc_devel_packages/ diff --git a/content/developers.md b/content/developers/index_old.md similarity index 93% rename from content/developers.md rename to content/developers/index_old.md index 6dd66c3ad..78576d296 100755 --- a/content/developers.md +++ b/content/developers/index_old.md @@ -4,14 +4,14 @@ software. Listed below are helpful links which will guide developers at different stages of their package.
        -
        + -
        +