Agave Microsites Quickstart

Agave ToGo Microsites are small, single-purpose web applications designed to service a small to medium sized group of users. Their primary goal is to provide a focused user experience around a single action or process. Whereas the Agave ToGo project provides a full-feature web interface to the Agave Platform, Agave ToGo microsites streamline the user's focus to a single, specific task. The first microsite focuses on running and managing a computational task. Additional microsites focused on data management, data collections, and task automation are currently under development.

This tutorial will walk you through the installation and configuration of a computational microsite. By the end of the tutorial, you will have a functional science gateway allowing you to run arbitrary

Installing

The microsites use several popular website packaging and dependency management tools support better software engineering and help establish best practices for new developers.

node - Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
node package manager (npm) - Installs, publishes and manages node programs.
bower - Package management for javascript.
sass - Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.
gulp - The streaming build system.

To install all the project prerequisites, run the following:

cd web  
npm install  
bower install

Building

To build the source, minify all relevant files, and prepare for release, run the following gulp command:

gulp sass:watch

If you are developing and would like the css to be rebuilt on each change, run the alternate command:

gulp sass:watch

Deploying

Each microsite is sufficiently self-contained that it can be deployed as a static web application which can be served from any publicly accessible web host such as a GitHub pages, Dropbox, Google Drive, or even a folder you make publicly accessible through the Agave Platform. You simply need to copy the contents of the web folder to your hosting location.

We have also bundled a web server into the gulp config, so you can bring the site up at [http://localhost:8080/app] by running the following command:

gulp localhost

Configuring

The microsites were designed to provide flexible styling and customization options. You can change the look and feel of the UI by using the theme settings dialog built into the website. To customize the site behavior, you can edit the config.js file in the `



In [1]:

    
auth-check -v









    



{
  "tenantid": "agave.prod",
  "baseurl": "https://public.agaveapi.co",
  "devurl": "",
  "apisecret": "8ofIXYXQd7r0mfitrJfuPjZ8eoIa",
  "apikey": "3ZeUK9NLpfWfVYItsoQA8O3MOvAa",
  "username": "dooley",
  "access_token": "62a236fed114ed1e0ef779085618b86",
  "refresh_token": "74d8c32401454a617d215731e9e0d6",
  "created_at": "1477931528",
  "expires_in": "14400",
  "expires_at": "Mon Oct 31 20:32:08 UTC 2016"
}



In [3]:

    
auth-tokens-refresh









    



Token for agave.prod:dooley successfully refreshed and cached for 14400 seconds
698738d10b4f74dff56fd6a33a83cd



In [12]:

    
cd work



In [13]:

    
git clone https://github.com/agaveplatform/microsites.git









    



api           contributors.txt         docker-compose.yml  README.md
CHANGELOG.md  docker-compose.test.yml  Dockerfile          web



In [14]:

    
files-list -S $VM_IPADDRESS-storage-$AGAVE_USERNAME









    



.
AbstractSoftwareResource.java
archive
picksumipsum.txt
togo-micro-app
Zihuatanejo



In [18]:

    
files-pems-update -R -u WORLD -p READ -S $VM_IPADDRESS-storage-$AGAVE_USERNAME work/microsites/web









    



Successfully updated permission for WORLD



In [19]:

    
systems-list -S









    



data.agaveapi.co



In [21]:

    
files-pems-list -v -S $VM_IPADDRESS-storage-$AGAVE_USERNAME  work/microsites/web









    



[
  {
    "username": "PUBLIC",
    "internalUsername": null,
    "permission": {
      "read": true,
      "write": false,
      "execute": false
    },
    "recursive": true,
    "_links": {
      "self": {
        "href": "https://public.agaveapi.co/files/v2/pems/system/data.agaveapi.co/dooley/togo-micro-app/web?username.eq=PUBLIC"
      },
      "file": {
        "href": "https://public.agaveapi.co/files/v2/media/system/data.agaveapi.co/dooley/togo-micro-app/web"
      },
      "profile": {
        "href": "https://public.agaveapi.co/profiles/v2/PUBLIC"
      }
    }
  },
  {
    "username": "WORLD",
    "internalUsername": null,
    "permission": {
      "read": true,
      "write": false,
      "execute": false
    },
    "recursive": true,
    "_links": {
      "self": {
        "href": "https://public.agaveapi.co/files/v2/pems/system/data.agaveapi.co/dooley/togo-micro-app/web?username.eq=WORLD"
      },
      "file": {
        "href": "https://public.agaveapi.co/files/v2/media/system/data.agaveapi.co/dooley/togo-micro-app/web"
      },
      "profile": {
        "href": "https://public.agaveapi.co/profiles/v2/WORLD"
      }
    }
  },
  {
    "username": "dooley",
    "internalUsername": null,
    "permission": {
      "read": true,
      "write": true,
      "execute": true
    },
    "recursive": true,
    "_links": {
      "self": {
        "href": "https://public.agaveapi.co/files/v2/pems/system/data.agaveapi.co/dooley/togo-micro-app/web?username.eq=dooley"
      },
      "file": {
        "href": "https://public.agaveapi.co/files/v2/media/system/data.agaveapi.co/dooley/togo-micro-app/web"
      },
      "profile": {
        "href": "https://public.agaveapi.co/profiles/v2/dooley"
      }
    }
  }
]



In [27]:

    
files-pems-list -S $VM_IPADDRESS-storage-$AGAVE_USERNAME work/microsites/web/app/index.html









    



dooley READ WRITE EXECUTE 
public READ



In [ ]:

    
postits-create -m 1000 "https://agaveauth.solveij.com/files/v2/download/$AGAVE_USERNAME/system/$VM_IPADDRESS-storage-$AGAVE_USERNAME/work/microsites/web/package.json"



In [31]:

    
alias gulp="$PWD/node_modules/gulp/bin/gulp.js"



In [32]:

    
alias bower="$PWD/node_modules/bower/bin/bower"



In [34]:

    
cd microsites



In [35]:

    
npm install
bower install









    



bash: npm: command not found



In [4]:

    
files-pems-update -R -u public -p -S $VM_IPADDRESS-storage-$AGAVE_USERNAME READ work/microsites/web









    



Successfully updated permission for public

Open up the site in your browser at: https://agaveauth.solveij.com/files/v2/download/$AGAVE_USERNAME/system/$VM_IPADDRESS-storage-$AGAVE_USERNAME/work/microsites/web/app/



In [ ]: