You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by ma...@apache.org on 2017/09/21 17:00:23 UTC

[53/54] [abbrv] airavata-django-portal git commit: Fixing up path differences

Fixing up path differences


Project: http://git-wip-us.apache.org/repos/asf/airavata-django-portal/repo
Commit: http://git-wip-us.apache.org/repos/asf/airavata-django-portal/commit/d566ab8c
Tree: http://git-wip-us.apache.org/repos/asf/airavata-django-portal/tree/d566ab8c
Diff: http://git-wip-us.apache.org/repos/asf/airavata-django-portal/diff/d566ab8c

Branch: refs/heads/master
Commit: d566ab8c1c30e0a651b54172b340f68af76f1b8f
Parents: d8d7c37
Author: Marcus Christie <ma...@iu.edu>
Authored: Thu Sep 21 10:52:40 2017 -0400
Committer: Marcus Christie <ma...@iu.edu>
Committed: Thu Sep 21 10:52:40 2017 -0400

----------------------------------------------------------------------
 django_airavata/apps/admin/package.json         |   6 +-
 .../build/check-versions.js                     |   2 +-
 .../build/webpack.base.conf.js                  |   2 +-
 .../static/django_airavata_admin/css/admin.css  |  29 ----
 .../static/django_airavata_admin/css/main.css   | 145 -------------------
 .../django_airavata_admin/css/main.css.map      |   7 -
 .../django_airavata_admin/images/delete.png     | Bin 428 -> 0 bytes
 .../static/django_airavata_admin/js/App.vue     |   5 -
 .../js/components/DashboardItem.vue             |  26 ----
 .../js/components/RecentExperiment.vue          |  19 ---
 .../components/admin/ApplicationDeployments.vue | 110 --------------
 .../js/components/admin/ApplicationDetails.vue  |  41 ------
 .../components/admin/ApplicationInputField.vue  | 101 -------------
 .../components/admin/ApplicationInterface.vue   | 104 -------------
 .../js/components/admin/BooleanRadioButton.vue  |  71 ---------
 .../js/components/admin/NewApplication.vue      | 112 --------------
 .../components/admin/NewApplicationButtons.vue  |  42 ------
 .../js/components/dashboards/AdminDashboard.vue |   6 -
 .../dashboards/AdminDashboardHome.vue           |  90 ------------
 .../dashboards/ExperimentDashboard.vue          | 104 -------------
 .../static/django_airavata_admin/js/main.js     |  31 ----
 .../static/django_airavata_admin/js/router.js   |  34 -----
 .../static/django_airavata_admin/js/store.js    |  67 ---------
 .../static/django_airavata_admin/js/utils.js    |   8 -
 .../static/django_airavata_admin/src/App.vue    |   5 +
 .../src/components/DashboardItem.vue            |  26 ++++
 .../src/components/RecentExperiment.vue         |  19 +++
 .../components/admin/ApplicationDeployments.vue | 110 ++++++++++++++
 .../src/components/admin/ApplicationDetails.vue |  41 ++++++
 .../components/admin/ApplicationInputField.vue  | 101 +++++++++++++
 .../components/admin/ApplicationInterface.vue   | 104 +++++++++++++
 .../src/components/admin/BooleanRadioButton.vue |  71 +++++++++
 .../src/components/admin/NewApplication.vue     | 112 ++++++++++++++
 .../components/admin/NewApplicationButtons.vue  |  42 ++++++
 .../components/dashboards/AdminDashboard.vue    |   6 +
 .../dashboards/AdminDashboardHome.vue           |  90 ++++++++++++
 .../dashboards/ExperimentDashboard.vue          | 104 +++++++++++++
 .../static/django_airavata_admin/src/main.js    |  31 ++++
 .../static/django_airavata_admin/src/router.js  |  34 +++++
 .../static/django_airavata_admin/src/store.js   |  66 +++++++++
 .../static/django_airavata_admin/src/utils.js   |   8 +
 .../django_airavata_admin/static/css/admin.css  |  29 ++++
 .../django_airavata_admin/static/css/main.css   | 145 +++++++++++++++++++
 .../static/css/main.css.map                     |   7 +
 .../static/images/delete.png                    | Bin 0 -> 428 bytes
 45 files changed, 1156 insertions(+), 1157 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/package.json
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/package.json b/django_airavata/apps/admin/package.json
index f344bf9..570c2cd 100644
--- a/django_airavata/apps/admin/package.json
+++ b/django_airavata/apps/admin/package.json
@@ -5,9 +5,9 @@
   "author": "Eldho Mathulla <em...@iu.edu>",
   "private": true,
   "scripts": {
-    "dev": "node build/dev-server.js",
-    "start": "node build/dev-server.js",
-    "build": "node build/build.js"
+    "dev": "node static/django_airavata_admin/build/dev-server.js",
+    "start": "node static/django_airavata_admin/build/dev-server.js",
+    "build": "node static/django_airavata_admin/build/build.js"
   },
   "dependencies": {
     "vue": "^2.3.3",

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/build/check-versions.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/build/check-versions.js b/django_airavata/apps/admin/static/django_airavata_admin/build/check-versions.js
index 100f3a0..511d927 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/build/check-versions.js
+++ b/django_airavata/apps/admin/static/django_airavata_admin/build/check-versions.js
@@ -1,6 +1,6 @@
 var chalk = require('chalk')
 var semver = require('semver')
-var packageConfig = require('../package.json')
+var packageConfig = require('../../../package.json')
 var shell = require('shelljs')
 function exec (cmd) {
   return require('child_process').execSync(cmd).toString().trim()

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/build/webpack.base.conf.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/build/webpack.base.conf.js b/django_airavata/apps/admin/static/django_airavata_admin/build/webpack.base.conf.js
index b3401f0..e5762b5 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/build/webpack.base.conf.js
+++ b/django_airavata/apps/admin/static/django_airavata_admin/build/webpack.base.conf.js
@@ -9,7 +9,7 @@ function resolve (dir) {
 
 module.exports = {
   entry: {
-    app: './src/main.js'
+    app: './static/django_airavata_admin/src/main.js'
   },
   output: {
     path: config.build.assetsRoot,

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/css/admin.css
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/css/admin.css b/django_airavata/apps/admin/static/django_airavata_admin/css/admin.css
deleted file mode 100644
index 55c2fdf..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/css/admin.css
+++ /dev/null
@@ -1,29 +0,0 @@
-.entry{
-  margin-top:20px;
-  display: block;
-}
-
-.entry .heading{
-  font-size:16px;
-  font-weight: bold;
-  margin-bottom: 10px;
-}
-
-.entry input,textarea{
-  width: 100%;
-  border-radius: 2px;
-  border: solid #dddddd 1px;
-  padding: 7px;
-}
-
-.main_section {
-  width: 100%;
-  display: block;
-  margin-top: 50px;
-  margin-bottom:20px;
-}
-
-.new-application-tab-main{
-  width: 65%;
-  margin-bottom:30px;
-}

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/css/main.css
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/css/main.css b/django_airavata/apps/admin/static/django_airavata_admin/css/main.css
deleted file mode 100644
index 523b230..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/css/main.css
+++ /dev/null
@@ -1,145 +0,0 @@
-html,
-body {
-  height: 100%; }
-
-body {
-  color: #333;
-  background-color: #f7f7f7; }
-
-.c-header {
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid #ddd;
-  background-color: #ffffff; }
-  .c-header__logo {
-    margin-right: 1rem;
-    width: 70px;
-    background-color: #990000; }
-    .c-header__logo svg {
-      display: block; }
-  .c-header__title {
-    font-size: 1.25rem;
-    line-height: 1; }
-    .c-header__title a {
-      color: #333; }
-  .c-header__controls {
-    margin-left: auto;
-    margin-right: 2rem; }
-
-.c-nav {
-  background-color: #444;
-  min-width: 70px;
-  min-height: 60px;
-  padding: 1rem 0;
-  margin-top: -1px;
-  display: flex; }
-  .c-nav__item {
-    color: #ccc;
-    font-size: 1.5rem;
-    display: block;
-    text-align: center;
-    line-height: 1;
-    flex-grow: 1; }
-    .c-nav__item:hover, .c-nav__item:focus {
-      color: #ffffff; }
-    .c-nav__item:active {
-      color: #bbb; }
-    .c-nav__item.is-active {
-      color: #ffffff; }
-
-@media screen and (min-width: 768px) {
-  .c-nav {
-    height: 100%;
-    flex-direction: column; }
-    .c-nav__item {
-      flex-grow: 0;
-      margin-bottom: 2rem; } }
-.stage {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column; }
-
-@media screen and (min-width: 768px) {
-  .stage {
-    flex-direction: row; } }
-.main-content {
-  flex-grow: 1;
-  padding: 1rem; }
-
-.sidebar {
-  flex-basis: 200px;
-  background-color: #ffffff; }
-
-.sidebar-header {
-  padding: 1.5rem;
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid #eee; }
-  .sidebar-header__title {
-    font-size: .825rem;
-    text-transform: uppercase;
-    letter-spacing: .04rem;
-    margin: 0; }
-  .sidebar-header__action {
-    margin-left: auto;
-    font-size: .825rem; }
-
-@media screen and (min-width: 768px) {
-  .sidebar {
-    min-width: 310px;
-    border-left: 1px solid #ddd; } }
-.card {
-  background-color: #fff;
-  border-radius: 4px;
-  border: none;
-  box-shadow: 0 2px 0 #eee;
-  margin-bottom: 30px; }
-
-/**
- * Make a small card text modifier so we can still use
- * Bootstrap's default styles if needed.
- */
-.card-text--small {
-  line-height: 1.4;
-  font-size: .825rem; }
-
-.card.is-disabled {
-  background-color: #ddd; }
-  .card.is-disabled .card-title {
-    color: #999999; }
-  .card.is-disabled .badge {
-    background-color: #ccc;
-    color: #999999; }
-
-.card-link:hover {
-  text-decoration: none;
-  background-color: #fafafa; }
-
-.card.is-disabled .card-link:hover {
-  background-color: #ddd;
-  cursor: not-allowed; }
-
-/**
- * Feed
- */
-.feed {
-  list-style: none;
-  margin: 0;
-  padding: 0; }
-  .feed__list-item {
-    padding: 1.5rem;
-    border-bottom: 1px solid #eee; }
-  .feed__label {
-    font-size: .825rem;
-    text-transform: uppercase; }
-  .feed__title {
-    font-size: 1rem;
-    margin: 0; }
-    .feed__title a {
-      color: #212529; }
-  .feed__item-meta {
-    margin: 0;
-    font-size: .825rem; }
-
-/*# sourceMappingURL=main.css.map */

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/css/main.css.map
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/css/main.css.map b/django_airavata/apps/admin/static/django_airavata_admin/css/main.css.map
deleted file mode 100644
index 3f5b826..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/css/main.css.map
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-"version": 3,
-"mappings": "AAAA;IACK;EACH,MAAM,EAAE,IAAI;;AAGd,IAAK;EACH,KAAK,EAAE,IAAI;EACX,gBAAgB,EAAE,OAAO;;AAG3B,SAAU;EACR,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,aAAa,EAAE,cAAc;EAC7B,gBAAgB,EAAE,OAAO;EAEzB,eAAQ;IACN,YAAY,EAAE,IAAI;IAClB,KAAK,EAAE,IAAI;IACX,gBAAgB,EAAE,OAAO;IAEzB,mBAAI;MACF,OAAO,EAAE,KAAK;EAIlB,gBAAS;IACP,SAAS,EAAE,OAAO;IAClB,WAAW,EAAE,CAAC;IAEd,kBAAE;MACA,KAAK,EAAE,IAAI;EAIf,mBAAY;IACV,WAAW,EAAE,IAAI;IACjB,YAAY,EAAE,IAAI;;AAItB,MAAO;EACL,gBAAgB,EAAE,IAAI;EACtB,SAAS,EAAE,IAAI;EACf,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,MAAM;EACf,UAAU,EAAE,IAAI;EAChB,OAAO,EAAE,IAAI;EAEb,YAAQ;IACN,KAAK,EAAE,IAAI;IACX,SAAS,EAAE,MAAM;IACjB,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,MAAM;IAClB,WAAW,EAAE,CAAC;IACd,SAAS,EAAE,CAAC;IAEZ,sCACQ;MACN,KAAK,EAAE,OAAO;IAGhB,mBAAS;MACP,KAAK,EAAE,IAAI;IAGb,sBAAY;MACV,KAAK,EAAE,OAAO;;AAKpB,oCAAqC;EACnC,MAAO;IACL,MAAM,EAAE,IAAI;IACZ,cAAc,EAAE,MAAM;IAEtB,YAAQ;MACN,SAAS,EAAE,CAAC;MACZ,aAAa,EAAE,IAAI;AAKzB,MAAO;EACL,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,IAAI;EACb,cAAc,EAA
 E,MAAM;;AAGxB,oCAAqC;EACnC,MAAO;IACL,cAAc,EAAE,GAAG;AAKvB,aAAc;EACZ,SAAS,EAAE,CAAC;EACZ,OAAO,EAAE,IAAI;;AAGf,QAAS;EACP,UAAU,EAAE,KAAK;EACjB,gBAAgB,EAAE,OAAO;;AAG3B,eAAgB;EACd,OAAO,EAAE,MAAM;EACf,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,aAAa,EAAE,cAAc;EAE7B,sBAAS;IACP,SAAS,EAAE,OAAO;IAClB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,MAAM;IACtB,MAAM,EAAE,CAAC;EAGX,uBAAU;IACR,WAAW,EAAE,IAAI;IACjB,SAAS,EAAE,OAAO;;AAItB,oCAAqC;EACnC,QAAS;IACP,SAAS,EAAE,KAAK;IAChB,WAAW,EAAE,cAAc;AAI/B,KAAM;EACJ,gBAAgB,EAAE,IAAI;EACtB,aAAa,EAAE,GAAG;EAClB,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,YAAY;EACxB,aAAa,EAAE,IAAI;;AAGrB;;;GAGG;AACH,iBAAkB;EAChB,WAAW,EAAE,GAAG;EAChB,SAAS,EAAE,OAAO;;AAGpB,iBAAkB;EAChB,gBAAgB,EAAE,IAAI;EAEtB,6BAAY;IACV,KAAK,EAAE,OAAO;EAGhB,wBAAO;IACL,gBAAgB,EAAE,IAAI;IACtB,KAAK,EAAE,OAAO;;AAIlB,gBAAiB;EACf,eAAe,EAAE,IAAI;EACrB,gBAAgB,EAAE,OAAO;;AAG3B,kCAAmC;EACjC,gBAAgB,EAAE,IAAI;EACtB,MAAM,EAAE,WAAW;;AAIrB;;GAEG;AAEH,KAAM;EACJ,UAAU,EAAE,IAAI;EAChB,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EAEV,gBAAa;IACX,OAAO,EAAE,
 MAAM;IACf,aAAa,EAAE,cAAc;EAG/B,YAAS;IACP,SAAS,EAAE,OAAO;IAClB,cAAc,EAAE,SAAS;EAG3B,YAAS;IACP,SAAS,EAAE,IAAI;IACf,MAAM,EAAE,CAAC;IAET,cAAE;MACA,KAAK,EAAE,OAAO;EAIlB,gBAAa;IACX,MAAM,EAAE,CAAC;IACT,SAAS,EAAE,OAAO",
-"sources": ["main.scss"],
-"names": [],
-"file": "main.css"
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/images/delete.png
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/images/delete.png b/django_airavata/apps/admin/static/django_airavata_admin/images/delete.png
deleted file mode 100644
index 1419360..0000000
Binary files a/django_airavata/apps/admin/static/django_airavata_admin/images/delete.png and /dev/null differ

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/App.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/App.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/App.vue
deleted file mode 100644
index 3615145..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/App.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <router-view>
-
-  </router-view>
-</template>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/DashboardItem.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/DashboardItem.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/DashboardItem.vue
deleted file mode 100644
index ebfbde9..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/DashboardItem.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<template>
-    <div class="col-md-6 col-xl-4">
-        <div class="card">
-            <a href="#0" class="card-link text-dark" v-bind:style="'min-height:'+ height+'px;'">
-                <div class="card-body"  >
-                    <h2 class="card-title h5">{{dashboard_item.appModuleName}}</h2>
-                    <span class="badge badge-primary mr-1" v-for="tag in dashboard_item.tags">{{tag}}</span>
-                    <span class="badge badge-primary mr-1" v-if="dashboard_item.appModuleVersion" >{{dashboard_item.appModuleVersion}}</span>
-                    <p class="card-text card-text--small mt-3 text-secondary">{{dashboard_item.appModuleDescription}}</p>
-                </div>
-            </a>
-        </div>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: 'dashboard-item',
-        props: ['dashboard_item','tags','height'],
-        data:function () {
-          return {
-            "height":100
-          };
-        }
-    }
-</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/RecentExperiment.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/RecentExperiment.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/RecentExperiment.vue
deleted file mode 100644
index b67378c..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/RecentExperiment.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<template>
-  <li class="feed__list-item">
-    <span class="feed__label text-secondary">{{experiment.name}}</span>
-    <h2 class="feed__title mb-2"><a href="#0">{{experiment.description}}</a></h2>
-    <span class="badge badge-success" v-if="experiment.status == 'Completed'">{{experiment.status}}</span>
-    <span class="badge badge-primary" v-else-if="experiment.status == 'Created'">{{experiment.status}}</span>
-    <span class="badge badge-danger" v-else="experiment.status == 'Failed'">{{experiment.status}}</span>
-    <div class="feed__item-meta text-secondary mt-1">
-      <span>Updated</span>
-      <time>{{experiment.updated}}</time>
-    </div>
-  </li>
-</template>
-<script>
-  export  default {
-    name:'recent-experiment',
-    props:['experiment']
-  }
-</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDeployments.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDeployments.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDeployments.vue
deleted file mode 100644
index f6a10f7..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDeployments.vue
+++ /dev/null
@@ -1,110 +0,0 @@
-<template>
-
-  <div class="main_section">
-
-    <div class="new-application-tab-main">
-      <h4>Application Deployments</h4>
-      <div class="entry">
-        <div class="heading">Application module</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading">Application compute host</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading">Application executable path</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading">Application Parallelism type</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading">Application deployment description</div>
-        <textarea style="height: 80px;" type="text"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <h4>Module load commands</h4>
-      <div class="entry">
-        <div class="heading">Module load commands</div>
-        <input type="text"/>
-      </div>
-      <div class="deployment-entry">
-        <input type="button" class="deployment btn" value="Add command"/>
-      </div>
-    </div>
-
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Library Prepend Paths</h4>
-        <input type="button" class="deployment btn" value="Add path"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Library Append Paths</h4>
-        <input type="button" class="deployment btn" value="Add path"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Environments</h4>
-        <input type="button" class="deployment btn" value="Add environment"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Pre Job Commands</h4>
-        <input type="button" class="deployment btn" value="Add command"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Post Job Commands</h4>
-        <input type="button" class="deployment btn" value="Add command"/>
-      </div>
-    </div>
-    <div class="new-application-tab-main">
-      <div class="deployment-entry">
-        <h4>Defaults</h4>
-        <input type="button" class="deployment btn" value="Add command"/>
-      </div>
-    </div>
-  </div>
-</template>
-<style>
-  .heading {
-    font-size: 1.0em;
-    font-weight: bold;
-    margin-bottom: 10px;
-  }
-
-  .deployment.btn {
-    float: right;
-    text-align: center;
-    border-color: #007BFF;
-    border-style: solid;
-    border-radius: 3px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-    padding-left: 15px;
-    padding-right: 15px;
-    color: #007BFF;
-    background-color: white;
-    width: auto;
-    float: left;
-  }
-
-  .deployment.btn:hover {
-    color: white;
-    background-color: rgba(0, 105, 217, 1);
-  }
-
-  .deployment-entry {
-    display: inline-block;
-    margin-top: 15px;
-  }
-</style>
-

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDetails.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDetails.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDetails.vue
deleted file mode 100644
index f8c1c11..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationDetails.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<template>
-
-  <div class="main_section">
-    <div class="new-application-tab-main">
-      <h4>Application Details</h4>
-      <div class="entry">
-        <div class="heading">Application Name</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading">Application Version</div>
-        <input type="text"/>
-      </div>
-      <div class="entry">
-        <div class="heading" >Experiment Description</div>
-        <textarea  style="height: 80px;" type="text"/>
-      </div>
-      <new-application-buttons></new-application-buttons>
-    </div>
-  </div>
-</template>
-<script>
-  import NewApplicationButtons from './NewApplicationButtons.vue';
-  export default{
-    components:{
-      NewApplicationButtons
-    },
-    data:function () {
-      return {
-
-      };
-    }
-  }
-
-</script>
-<style>
-
-
-
-
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInputField.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInputField.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInputField.vue
deleted file mode 100644
index 1afa93b..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInputField.vue
+++ /dev/null
@@ -1,101 +0,0 @@
-<template>
-  <div class="main_section interface-main">
-    <div class="input-field-header">
-      Input Fields
-      <img v-on:click="delete_event_trigger();" src="/static/images/delete.png"/>
-    </div>
-    <div class="entry">
-      <div class="heading">Name</div>
-      <input type="text" v-model="data.name"/>
-    </div>
-    <div class="entry">
-      <div class="heading" v-model="data.value">Value</div>
-      <input type="text"/>
-    </div>
-    <div class="entry">
-      <div class="heading" v-model="data.type">Type</div>
-      <input type="text"/>
-    </div>
-    <div class="entry">
-      <div class="heading">Application argument</div>
-      <input v-model="data.appArg" type="text"/>
-    </div>
-    <div class="entry boolean-selectors">
-      <boolean-radio-button v-bind:heading="'Data is staged'" v-bind:selectorVal="data.dataStaged"></boolean-radio-button>
-      <boolean-radio-button v-bind:heading="'Required'" v-bind:selectorVal="data.required"></boolean-radio-button>
-    </div>
-    <div class="entry boolean-selectors">
-      <boolean-radio-button v-bind:heading="'Required on command line'" v-bind:selectorVal="data.requiredOnCmd"></boolean-radio-button>
-    </div>
-  </div>
-</template>
-<script>
-  import BooleanRadioButton from './BooleanRadioButton.vue'
-  export default {
-    components:{
-      BooleanRadioButton
-    },
-    methods:{
-      delete_event_trigger:function(){
-        this.$emit('delete_input_field');
-      }
-    },
-    created:function(){
-      this.data=this.data;
-    },
-    props:{
-      data:{
-        type:Object,
-        default:function () {
-          return{
-            name:'',
-            value:'',
-            type:'',
-            appArg:'',
-            dataStaged:{'boolValue':'true'},
-            required:{'boolValue':'false'},
-            requiredOnCmd:{'boolValue':'false'}
-          };
-        }
-      }
-    },
-    watch:{
-    }
-  }
-</script>
-
-<style>
-  .input-field-header{
-    background-color: #F8F8F8;
-    width: 100%;
-    padding: 15px;
-    border: solid 1px #dddddd;
-    text-align: left;
-  }
-
-  .input-field-header img{
-    float: right;
-    }
-
-
-
-  .main_section.interface-main .entry{
-    margin-bottom: 40px;
-    margin-left:15px;
-    margin-right: 15px;
-  }
-
-  .entry.boolean-selectors{
-    display: flex;
-  }
-
-  .entry.boolean-selectors div{
-    margin-right: 60px;
-  }
-
-  .interface-main{
-    border: solid 1px #dddddd;
-    border-radius: 4px;
-  }
-
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInterface.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInterface.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInterface.vue
deleted file mode 100644
index 474efbc..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/ApplicationInterface.vue
+++ /dev/null
@@ -1,104 +0,0 @@
-<template>
-
-  <div class="main_section">
-
-    <div class="new-application-tab-main">
-      <h4>Application Interface</h4>
-      <div class="entry boolean-selectors">
-        <boolean-radio-button v-bind:heading="'Enable Archiving Working Directory'" v-bind:selectorVal="work_dir"></boolean-radio-button>
-        <boolean-radio-button v-bind:heading="'Enable Optional File Inputs'" v-bind:selectorVal="optional_files"></boolean-radio-button>
-      </div>
-      <div>
-        <application-input-field class="interface-main"  v-for="data in obj.inputFields" v-bind:data="data" v-bind:key="data.input_id" v-on:delete_input_field="delete_event_trigger(data.input_id);"></application-input-field>
-      </div>
-      <div class="entry">
-        <button class="interface-btn" v-on:click="addApplicationInput();">Add Application <span>input</span></button>
-      </div>
-      <div class="entry">
-        <div class="heading">Output fields</div>
-        <button class="interface-btn">Add Application <span>output</span></button>
-      </div>
-      <new-application-buttons></new-application-buttons>
-    </div>
-  </div>
-</template>
-<script>
-  import ApplicationInputField from './ApplicationInputField.vue';
-  import BooleanRadioButton from './BooleanRadioButton.vue';
-  import NewApplicationButtons from './NewApplicationButtons.vue';
-
-  import { mapGetters } from 'vuex';
-
-  export default {
-    components:{
-
-      ApplicationInputField,BooleanRadioButton,NewApplicationButtons
-    },
-    data:function () {
-      return {
-        'id':0,
-        work_dir:{'boolValue':'false'},
-        optional_files:{'boolValue':'true'}
-      };
-    },
-    props:{
-      'obj':{
-        type:Object,
-        default:function () {
-          return {
-            'inputFields':[]
-          };
-        }
-      }
-    },
-    mounted:function () {
-      this.addApplicationInput();
-    },
-    methods:{
-      addApplicationInput:function () {
-        this.obj.inputFields.push({
-          input_id:this.id++,
-          name:'',
-          value:'',
-          type:'',
-          appArg:'',
-          dataStaged:{'boolValue':'true'},
-          required:{'boolValue':'false'},
-          requiredOnCmd:{'boolValue':'false'}
-        });
-      },
-      delete_event_trigger:function(input_id){
-        console.log('deleting input Field: '+input_id);
-        this.obj.inputFields=this.obj.inputFields.filter((data)=>data.input_id!=input_id);
-      },
-    }
-  };
-</script>
-<style>
- .interface-btn{
-   color: #868E96;
-   border: solid 1px #868E96;
-   background-color: transparent;
-   text-align: center;
-   border-radius: 3px;
-   padding-top: 5px;
-   padding-bottom:5px;
-   padding-left:15px;
-   padding-right: 15px;
- }
-  .interface-btn span{
-    font-weight: bold;
-  }
-
- .interface-btn:hover{
-   background-color: rgba(0,105,217,1);
-   color: white;
- }
-
- .entry.boolean-selectors{
-   display: flex;
- }
-
-
-</style>
-

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/BooleanRadioButton.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/BooleanRadioButton.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/BooleanRadioButton.vue
deleted file mode 100644
index d6190d6..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/BooleanRadioButton.vue
+++ /dev/null
@@ -1,71 +0,0 @@
-<template>
-  <div class="boolean-selector-main">
-    <div class="boolean-selector-heading">{{heading}}</div>
-    <div class="boolean-selector">
-      <div>
-        <input type="radio" v-model="selectorVal.boolValue" value="true"/>
-        <label>True</label>
-      </div>
-      <div>
-        <input type="radio" v-model="selectorVal.boolValue" value="false"/>
-        <label>False</label>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-
-  export default {
-    mounted:function(){
-      //console.log('Selctor Value: '+ this.selectorVal.boolValue);
-      this.selectorVal.boolValue=this.selectorVal.boolValue;
-    },
-    props:{
-      selectorVal:{
-        type:Object,
-        default:function () {
-          return {
-            'boolValue':'false',
-          };
-        }
-      },
-      heading:{
-        type:String
-      },
-      selectorId:{
-        type:String,
-        default:'na'
-      }
-    }
-  }
-</script>
-<style>
-  .boolean-selector-main{
-    display: block;
-  }
-  .boolean-selector{
-    display: flex;
-    font-weight: 100;
-  }
-
-  .boolean-selector div{
-    display: flex;
-    margin-right: 25px;
-  }
-
-  .boolean-selector div label{
-    margin-left: 10px;
-    text-align: center;
-    font-weight: bold;
-    padding-top: 4px;
-  }
-
-  .boolean-selector-heading{
-    font-size:1.1em;
-    font-weight: 400;
-    margin-bottom: 10px;
-    color: black;
-    width: 100%;
-
-  }
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplication.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplication.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplication.vue
deleted file mode 100644
index 73f52d0..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplication.vue
+++ /dev/null
@@ -1,112 +0,0 @@
-<template>
-  <div class="new_app">
-    <h3>Create A New Application</h3>
-    <div class="main">
-      <div class="tabs">
-        <div class="tab" v-bind:class="tabs['details']"><router-link class="link" :to="{name:'details'}"><label class="lbl">Details</label></router-link></div>
-        <div class="tab" v-bind:class="tabs['interface']" v-bind:obj="appInterfaceTabData"><router-link class="link" :to="{name:'interface'}"><label class="lbl">Interface</label></router-link></div>
-        <div class="tab" v-bind:class="tabs['deployments']"><router-link class="link" :to="{name:'deployments'}"><label class="lbl">Deployments</label></router-link></div>
-        <div class="tab" style="width: 100%"></div>
-      </div>
-      <transition mode="out-in">
-        <router-view :key="$route.path"></router-view>
-      </transition>
-    </div>
-  </div>
-</template>
-<script>
-  import ApplicationDetails from './ApplicationDetails.vue'
-  import ApplicationInterface from './ApplicationInterface.vue'
-  export default {
-    components: {
-      ApplicationDetails,ApplicationInterface
-    },
-    mounted:function () {
-      this.current_active_tab=this.$route.name;
-      this.previous_active_tab='';
-    },
-    data: function () {
-      return {
-        current_active_tab: 0,
-        previous_active_tab: -1,
-        appInterfaceTabData:{'inputFields':[]}
-      };
-    },
-    computed: {
-      tabs: function () {
-        var tabs_active = {
-          'details':'',
-          'interface':'',
-          'deployments':''
-        };
-        tabs_active[this.current_active_tab] = 'active';
-        if (tabs_active.hasOwnProperty(this.previous_active_tab)) {
-          tabs_active[this.previous_active_tab] = '';
-        }
-        return tabs_active;
-      }
-    },
-    watch:{
-      '$route' (to, from) {
-        this.previous_active_tab=from.name
-        this.current_active_tab=to.name
-
-      }
-    }
-  }
-</script>
-<style>
-  .new_app {
-    margin: 45px;
-    width: 70%;
-  }
-
-  .main {
-    width: 100%;
-    margin-top: 50px;
-  }
-
-  .tab {
-    text-align: center;
-    width: 120px;
-    margin-bottom: 15px;
-    border-bottom: solid #999999 1px;
-    color: #007BFF;
-  }
-
-  .tab .lbl:hover {
-    cursor: pointer;
-  }
-
-  .active .lbl:hover {
-    cursor: default;
-  }
-
-  .lbl {
-    margin: 10px;
-    color: inherit;
-  }
-
-  .link{
-    color: inherit;
-  }
-
-  .active {
-    color: #333333;
-    border-top: solid #999999 1px;
-    border-left: solid #999999 1px;
-    border-right: solid #999999 1px;
-    border-bottom: hidden;
-    border-top-right-radius: 3px;
-    border-top-left-radius: 3px;
-  }
-
-  .tabs {
-    display: flex;
-    width: 100%;
-  }
-
-
-
-
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplicationButtons.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplicationButtons.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplicationButtons.vue
deleted file mode 100644
index 0bedc37..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/admin/NewApplicationButtons.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-<template>
-  <div class="btns">
-    <input class="cancel" type="button" value="Cancel"/>
-    <input class="save" type="button" value="Save"/>
-  </div>
-</template>
-<style>
-  .btns{
-    margin-top:50px;
-    display: inline-block;
-    width: 100%;
-  }
-
-  .btns input{
-    float: right;
-    margin-left: 20px;
-    text-align: center;
-    border-color: #007BFF;
-    border-style: solid;
-    border-radius: 3px;
-    padding-top: 5px;
-    padding-bottom:5px;
-    padding-left:15px;
-    padding-right: 15px;
-  }
-
-  .btns input:hover{
-    background-color: #3ca41a;
-    color: #f1fff3;
-  }
-
-  .save{
-    background-color: #007BFF;
-    color: white;
-  }
-
-  .cancel{
-    color:  #007BFF;
-    background-color: white;
-  }
-
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboard.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboard.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboard.vue
deleted file mode 100644
index 254dac1..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboard.vue
+++ /dev/null
@@ -1,6 +0,0 @@
-<template>
-<router-view>
-
-</router-view>
-</template>
-

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboardHome.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboardHome.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboardHome.vue
deleted file mode 100644
index be1b768..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/AdminDashboardHome.vue
+++ /dev/null
@@ -1,90 +0,0 @@
-<template>
-  <div class="new_app">
-    <div class="new_app_header">
-      <h4 style="display: inline-block">Application Catalog</h4>
-      <router-link :to="{name:'details'}"><button v-on="this.$emit('new_application')">New Application <span>+</span></button></router-link>
-    </div>
-    <div class="applications">
-      <h6 style="color: #666666;">APPLICATIONS</h6>
-      <div class="container-fluid">
-        <div class="row">
-        <DashboardItem
-          v-for="item in applications" v-bind:dashboard_item="item" v-bind:key="item.title">
-        </DashboardItem>
-          </div>
-      </div>
-
-    </div>
-  </div>
-</template>
-<script>
-  import DashboardItem from '../DashboardItem.vue'
-  import NewApplication from '../admin/NewApplication.vue'
-  export default {
-    data:function () {
-      return {
-        "applications":[]
-      };
-    },
-    components:{
-      DashboardItem,NewApplication
-    },
-    mounted:function () {
-      this.fetchApplications();
-    },
-    methods:{
-      fetchApplications:function () {
-        var convert=function (applications) {
-
-        };
-        this.$http.get('/api/applications').then(response => {
-          this.applications=response.body;
-        }, response => {
-          this.applications=[{
-            "appModuleId": "",
-            "appModuleName": "No Applications Found",
-            "appModuleDescription": "",
-            "appModuleVersion": ""
-          }]
-        });
-      },
-
-    }
-  }
-</script>
-<style>
-  .new_app {
-    margin: 45px;
-    width: 100%;
-  }
-
-  .new_app_header{
-    width: 100%;
-    display: inline;
-  }
-
-  .new_app_header button{
-    background-color: #2e73bc;
-    color: white;
-    border: solid #2e73bc 1px ;
-    border-radius: 3px;
-    float: right;
-    padding-right: 15px;
-    padding-left: 15px;
-    padding-bottom: 8px;
-    padding-top: 3px;
-  }
-
-  .new_app_header button:hover{
-    cursor: pointer;
-  }
-
-  .new_app_header button span{
-    font-weight: 900;
-    font-size: larger;
-  }
-
-  .applications{
-    margin-top: 50px;
-  }
-</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/ExperimentDashboard.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/ExperimentDashboard.vue b/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/ExperimentDashboard.vue
deleted file mode 100644
index 2898745..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/components/dashboards/ExperimentDashboard.vue
+++ /dev/null
@@ -1,104 +0,0 @@
-<template>
-  <div class="stage">
-    <main class="main-content">
-      <div class="container-fluid">
-        <h1 class="h4 mb-4">Dashboard</h1>
-      </div>
-      <div class="container-fluid">
-        <div class="row">
-          <DashboardItem
-            v-for="item in applications" v-bind:dashboard_item="item" v-bind:key="item.title" v-bind:height="height">
-          </DashboardItem>
-        </div>
-      </div>
-    </main>
-    <aside class="sidebar">
-      <header class="sidebar-header">
-        <h1 class="sidebar-header__title">Recent Experiments</h1>
-        <a href="#0" class="sidebar-header__action" v-on:click="views_all_click_handler">View all</a>
-      </header>
-
-      <ol class="feed">
-        <RecentExperiment v-for="experiment in experiments"
-                          v-if="experiment.index <default_experiment_count || view_all" v-bind:experiment="experiment"
-                          v-bind:key="experiment.name"></RecentExperiment>
-      </ol>
-    </aside>
-  </div>
-</template>
-<script>
-  import DashboardItem from '../DashboardItem.vue'
-  import RecentExperiment from '../RecentExperiment.vue'
-  import {addIndex} from '../../utils.js'
-
-  export default{
-    'name':'main-section',
-    components: {
-      DashboardItem, RecentExperiment
-    },
-    data:function () {
-
-      var data_returned={
-        "view_all": false,
-        "default_experiment_count": 3,
-        "height":180,
-        "applications":
-          [
-
-          ]
-        , "experiments": [
-          {
-            "name": "Gaussian",
-            "description": "My very first test experiment",
-            "status": "Failed",
-            "updated": "14 minutes ago"
-          },
-          {
-            "name": "Lampps",
-            "description": "A really BIG experiment That Has a Really Long Title",
-            "status": "Completed",
-            "updated": "20 hours ago"
-          },
-          {
-            "name": "Gromacs",
-            "description": "exp_4a56w4892s23r6p9y_1",
-            "status": "Created",
-            "updated": "2 days ago"
-          },
-          {
-            "name": "RandExpr",
-            "description": "exp_4a56w4892s23r6p9y_1",
-            "status": "Failed",
-            "updated": "5 days ago"
-          }
-        ]
-      };
-      addIndex(data_returned["experiments"]);
-      return data_returned;
-    },
-    mounted:function () {
-      this.fetchApplications();
-    },
-    methods: {
-      "views_all_click_handler": function () {
-        this.view_all = !this.view_all;
-      },
-      fetchApplications:function () {
-        var convert=function (applications) {
-
-        };
-        this.$http.get('/api/applications').then(response => {
-          this.applications=response.body;
-        }, response => {
-          this.applications=[{
-            "appModuleId": "",
-            "appModuleName": "No Applications Found",
-            "appModuleDescription": "",
-            "appModuleVersion": ""
-          }]
-        });
-      }
-
-    }
-  }
-</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/main.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/main.js b/django_airavata/apps/admin/static/django_airavata_admin/js/main.js
deleted file mode 100644
index 35b0f10..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/main.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import Vue from 'vue';
-import VueResource from 'vue-resource';
-import VueRouter from 'vue-router';
-import Vuex from 'vuex';
-
-import ExperimentsDashboard from './components/dashboards/ExperimentDashboard.vue';
-import AdminDashboard from './components/dashboards/AdminDashboard.vue';
-
-import router from './router';
-import storeParams from './store';
-
-Vue.config.productionTip = false;
-
-Vue.use(VueResource);
-Vue.use(VueRouter);
-Vue.use(Vuex);
-
-var store=new Vuex.Store(storeParams);
-
-export function initializeApacheAiravataDashboard(dashboardName) {
-  return new Vue({
-    el: '#app',
-    router,
-    store,
-    template: '<' + dashboardName + '/>',
-    components: {ExperimentsDashboard, AdminDashboard}
-
-  })
-};
-
-

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/router.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/router.js b/django_airavata/apps/admin/static/django_airavata_admin/js/router.js
deleted file mode 100644
index 291151b..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/router.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import AdminDashboardHome from './components/dashboards/AdminDashboardHome.vue'
-import NewApplication from './components/admin/NewApplication.vue'
-import ExperimentsDashboard from './components/dashboards/ExperimentDashboard.vue'
-import ApplicationDetails from'./components/admin/ApplicationDetails.vue'
-import ApplicationInterface from './components/admin/ApplicationInterface.vue'
-import ApplicationDeployments from  './components/admin/ApplicationDeployments.vue'
-import VueRouter from 'vue-router'
-
-
-const routes=[
-  { path: '/new/application', component: NewApplication,name:'newapp',
-  children:[
-    {
-      path:'details',
-      component:ApplicationDetails,
-      name:'details',
-
-    },{
-      path:'interface',
-      component:ApplicationInterface,
-      name:'interface'
-    },{
-      path:'deployments',
-      component:ApplicationDeployments,
-      name:'deployments'
-
-    }
-  ]},
-  { path: '/', component: AdminDashboardHome },
-  {path:'/experiments',component:ExperimentsDashboard}
-];
-export default new VueRouter({
-  routes:routes
-});

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/store.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/store.js b/django_airavata/apps/admin/static/django_airavata_admin/js/store.js
deleted file mode 100644
index fbabdd0..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/store.js
+++ /dev/null
@@ -1,67 +0,0 @@
-
-const store={
-  modules:{
-    appInterfaceTab:{
-      state:{
-        inputFields:[],
-        counter:0
-      },
-      mutations:{
-        createAppInterfaceInputField:function (state) {
-          state.inputFields.push(
-            {
-              input_id:state.counter++,
-              name:'',
-              value:'',
-              type:'',
-              appArg:'',
-              dataStaged:false,
-              requiredId:false,
-              requiredOnCmdId:false
-            }
-          );
-        }
-      },
-      getters:{
-        getAppInterface:state=>{
-          return state.data;
-        }
-      }
-    },
-    appDetailsTab:{
-      state:{
-        data:{},
-      },
-      mutations:{
-        addAppDetails:function (state,data) {
-          state.data=data;
-        }
-      },
-      getters:{
-        getAppDetails:(state,getters)=>{
-          return state.data;
-        }
-      }
-    },
-    appDeploymentsTab:{
-      state:{
-        data:{},
-      },
-      mutations:{
-        addAppDeployments:function (state,data) {
-          state.data=data;
-        }
-      },
-      getters:{
-        getAppDeployments:(state,getters)=>{
-          return state.data;
-        }
-      }
-    }
-  }
-};
-
-export default {
-  'store':store
-}
-

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/js/utils.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/js/utils.js b/django_airavata/apps/admin/static/django_airavata_admin/js/utils.js
deleted file mode 100644
index 076a033..0000000
--- a/django_airavata/apps/admin/static/django_airavata_admin/js/utils.js
+++ /dev/null
@@ -1,8 +0,0 @@
-
-
-export function addIndex(list){
-  for(var i=0;i<list.length;i++){
-      list[i].index=i;
-  }
-  return list;
-}

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/App.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/App.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/App.vue
new file mode 100644
index 0000000..3615145
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/App.vue
@@ -0,0 +1,5 @@
+<template>
+  <router-view>
+
+  </router-view>
+</template>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/DashboardItem.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/DashboardItem.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/DashboardItem.vue
new file mode 100644
index 0000000..ebfbde9
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/DashboardItem.vue
@@ -0,0 +1,26 @@
+<template>
+    <div class="col-md-6 col-xl-4">
+        <div class="card">
+            <a href="#0" class="card-link text-dark" v-bind:style="'min-height:'+ height+'px;'">
+                <div class="card-body"  >
+                    <h2 class="card-title h5">{{dashboard_item.appModuleName}}</h2>
+                    <span class="badge badge-primary mr-1" v-for="tag in dashboard_item.tags">{{tag}}</span>
+                    <span class="badge badge-primary mr-1" v-if="dashboard_item.appModuleVersion" >{{dashboard_item.appModuleVersion}}</span>
+                    <p class="card-text card-text--small mt-3 text-secondary">{{dashboard_item.appModuleDescription}}</p>
+                </div>
+            </a>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'dashboard-item',
+        props: ['dashboard_item','tags','height'],
+        data:function () {
+          return {
+            "height":100
+          };
+        }
+    }
+</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/RecentExperiment.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/RecentExperiment.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/RecentExperiment.vue
new file mode 100644
index 0000000..b67378c
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/RecentExperiment.vue
@@ -0,0 +1,19 @@
+<template>
+  <li class="feed__list-item">
+    <span class="feed__label text-secondary">{{experiment.name}}</span>
+    <h2 class="feed__title mb-2"><a href="#0">{{experiment.description}}</a></h2>
+    <span class="badge badge-success" v-if="experiment.status == 'Completed'">{{experiment.status}}</span>
+    <span class="badge badge-primary" v-else-if="experiment.status == 'Created'">{{experiment.status}}</span>
+    <span class="badge badge-danger" v-else="experiment.status == 'Failed'">{{experiment.status}}</span>
+    <div class="feed__item-meta text-secondary mt-1">
+      <span>Updated</span>
+      <time>{{experiment.updated}}</time>
+    </div>
+  </li>
+</template>
+<script>
+  export  default {
+    name:'recent-experiment',
+    props:['experiment']
+  }
+</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDeployments.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDeployments.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDeployments.vue
new file mode 100644
index 0000000..f6a10f7
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDeployments.vue
@@ -0,0 +1,110 @@
+<template>
+
+  <div class="main_section">
+
+    <div class="new-application-tab-main">
+      <h4>Application Deployments</h4>
+      <div class="entry">
+        <div class="heading">Application module</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading">Application compute host</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading">Application executable path</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading">Application Parallelism type</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading">Application deployment description</div>
+        <textarea style="height: 80px;" type="text"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <h4>Module load commands</h4>
+      <div class="entry">
+        <div class="heading">Module load commands</div>
+        <input type="text"/>
+      </div>
+      <div class="deployment-entry">
+        <input type="button" class="deployment btn" value="Add command"/>
+      </div>
+    </div>
+
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Library Prepend Paths</h4>
+        <input type="button" class="deployment btn" value="Add path"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Library Append Paths</h4>
+        <input type="button" class="deployment btn" value="Add path"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Environments</h4>
+        <input type="button" class="deployment btn" value="Add environment"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Pre Job Commands</h4>
+        <input type="button" class="deployment btn" value="Add command"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Post Job Commands</h4>
+        <input type="button" class="deployment btn" value="Add command"/>
+      </div>
+    </div>
+    <div class="new-application-tab-main">
+      <div class="deployment-entry">
+        <h4>Defaults</h4>
+        <input type="button" class="deployment btn" value="Add command"/>
+      </div>
+    </div>
+  </div>
+</template>
+<style>
+  .heading {
+    font-size: 1.0em;
+    font-weight: bold;
+    margin-bottom: 10px;
+  }
+
+  .deployment.btn {
+    float: right;
+    text-align: center;
+    border-color: #007BFF;
+    border-style: solid;
+    border-radius: 3px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    padding-left: 15px;
+    padding-right: 15px;
+    color: #007BFF;
+    background-color: white;
+    width: auto;
+    float: left;
+  }
+
+  .deployment.btn:hover {
+    color: white;
+    background-color: rgba(0, 105, 217, 1);
+  }
+
+  .deployment-entry {
+    display: inline-block;
+    margin-top: 15px;
+  }
+</style>
+

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDetails.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDetails.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDetails.vue
new file mode 100644
index 0000000..f8c1c11
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationDetails.vue
@@ -0,0 +1,41 @@
+<template>
+
+  <div class="main_section">
+    <div class="new-application-tab-main">
+      <h4>Application Details</h4>
+      <div class="entry">
+        <div class="heading">Application Name</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading">Application Version</div>
+        <input type="text"/>
+      </div>
+      <div class="entry">
+        <div class="heading" >Experiment Description</div>
+        <textarea  style="height: 80px;" type="text"/>
+      </div>
+      <new-application-buttons></new-application-buttons>
+    </div>
+  </div>
+</template>
+<script>
+  import NewApplicationButtons from './NewApplicationButtons.vue';
+  export default{
+    components:{
+      NewApplicationButtons
+    },
+    data:function () {
+      return {
+
+      };
+    }
+  }
+
+</script>
+<style>
+
+
+
+
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInputField.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInputField.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInputField.vue
new file mode 100644
index 0000000..1afa93b
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInputField.vue
@@ -0,0 +1,101 @@
+<template>
+  <div class="main_section interface-main">
+    <div class="input-field-header">
+      Input Fields
+      <img v-on:click="delete_event_trigger();" src="/static/images/delete.png"/>
+    </div>
+    <div class="entry">
+      <div class="heading">Name</div>
+      <input type="text" v-model="data.name"/>
+    </div>
+    <div class="entry">
+      <div class="heading" v-model="data.value">Value</div>
+      <input type="text"/>
+    </div>
+    <div class="entry">
+      <div class="heading" v-model="data.type">Type</div>
+      <input type="text"/>
+    </div>
+    <div class="entry">
+      <div class="heading">Application argument</div>
+      <input v-model="data.appArg" type="text"/>
+    </div>
+    <div class="entry boolean-selectors">
+      <boolean-radio-button v-bind:heading="'Data is staged'" v-bind:selectorVal="data.dataStaged"></boolean-radio-button>
+      <boolean-radio-button v-bind:heading="'Required'" v-bind:selectorVal="data.required"></boolean-radio-button>
+    </div>
+    <div class="entry boolean-selectors">
+      <boolean-radio-button v-bind:heading="'Required on command line'" v-bind:selectorVal="data.requiredOnCmd"></boolean-radio-button>
+    </div>
+  </div>
+</template>
+<script>
+  import BooleanRadioButton from './BooleanRadioButton.vue'
+  export default {
+    components:{
+      BooleanRadioButton
+    },
+    methods:{
+      delete_event_trigger:function(){
+        this.$emit('delete_input_field');
+      }
+    },
+    created:function(){
+      this.data=this.data;
+    },
+    props:{
+      data:{
+        type:Object,
+        default:function () {
+          return{
+            name:'',
+            value:'',
+            type:'',
+            appArg:'',
+            dataStaged:{'boolValue':'true'},
+            required:{'boolValue':'false'},
+            requiredOnCmd:{'boolValue':'false'}
+          };
+        }
+      }
+    },
+    watch:{
+    }
+  }
+</script>
+
+<style>
+  .input-field-header{
+    background-color: #F8F8F8;
+    width: 100%;
+    padding: 15px;
+    border: solid 1px #dddddd;
+    text-align: left;
+  }
+
+  .input-field-header img{
+    float: right;
+    }
+
+
+
+  .main_section.interface-main .entry{
+    margin-bottom: 40px;
+    margin-left:15px;
+    margin-right: 15px;
+  }
+
+  .entry.boolean-selectors{
+    display: flex;
+  }
+
+  .entry.boolean-selectors div{
+    margin-right: 60px;
+  }
+
+  .interface-main{
+    border: solid 1px #dddddd;
+    border-radius: 4px;
+  }
+
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInterface.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInterface.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInterface.vue
new file mode 100644
index 0000000..474efbc
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/ApplicationInterface.vue
@@ -0,0 +1,104 @@
+<template>
+
+  <div class="main_section">
+
+    <div class="new-application-tab-main">
+      <h4>Application Interface</h4>
+      <div class="entry boolean-selectors">
+        <boolean-radio-button v-bind:heading="'Enable Archiving Working Directory'" v-bind:selectorVal="work_dir"></boolean-radio-button>
+        <boolean-radio-button v-bind:heading="'Enable Optional File Inputs'" v-bind:selectorVal="optional_files"></boolean-radio-button>
+      </div>
+      <div>
+        <application-input-field class="interface-main"  v-for="data in obj.inputFields" v-bind:data="data" v-bind:key="data.input_id" v-on:delete_input_field="delete_event_trigger(data.input_id);"></application-input-field>
+      </div>
+      <div class="entry">
+        <button class="interface-btn" v-on:click="addApplicationInput();">Add Application <span>input</span></button>
+      </div>
+      <div class="entry">
+        <div class="heading">Output fields</div>
+        <button class="interface-btn">Add Application <span>output</span></button>
+      </div>
+      <new-application-buttons></new-application-buttons>
+    </div>
+  </div>
+</template>
+<script>
+  import ApplicationInputField from './ApplicationInputField.vue';
+  import BooleanRadioButton from './BooleanRadioButton.vue';
+  import NewApplicationButtons from './NewApplicationButtons.vue';
+
+  import { mapGetters } from 'vuex';
+
+  export default {
+    components:{
+
+      ApplicationInputField,BooleanRadioButton,NewApplicationButtons
+    },
+    data:function () {
+      return {
+        'id':0,
+        work_dir:{'boolValue':'false'},
+        optional_files:{'boolValue':'true'}
+      };
+    },
+    props:{
+      'obj':{
+        type:Object,
+        default:function () {
+          return {
+            'inputFields':[]
+          };
+        }
+      }
+    },
+    mounted:function () {
+      this.addApplicationInput();
+    },
+    methods:{
+      addApplicationInput:function () {
+        this.obj.inputFields.push({
+          input_id:this.id++,
+          name:'',
+          value:'',
+          type:'',
+          appArg:'',
+          dataStaged:{'boolValue':'true'},
+          required:{'boolValue':'false'},
+          requiredOnCmd:{'boolValue':'false'}
+        });
+      },
+      delete_event_trigger:function(input_id){
+        console.log('deleting input Field: '+input_id);
+        this.obj.inputFields=this.obj.inputFields.filter((data)=>data.input_id!=input_id);
+      },
+    }
+  };
+</script>
+<style>
+ .interface-btn{
+   color: #868E96;
+   border: solid 1px #868E96;
+   background-color: transparent;
+   text-align: center;
+   border-radius: 3px;
+   padding-top: 5px;
+   padding-bottom:5px;
+   padding-left:15px;
+   padding-right: 15px;
+ }
+  .interface-btn span{
+    font-weight: bold;
+  }
+
+ .interface-btn:hover{
+   background-color: rgba(0,105,217,1);
+   color: white;
+ }
+
+ .entry.boolean-selectors{
+   display: flex;
+ }
+
+
+</style>
+

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/BooleanRadioButton.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/BooleanRadioButton.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/BooleanRadioButton.vue
new file mode 100644
index 0000000..d6190d6
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/BooleanRadioButton.vue
@@ -0,0 +1,71 @@
+<template>
+  <div class="boolean-selector-main">
+    <div class="boolean-selector-heading">{{heading}}</div>
+    <div class="boolean-selector">
+      <div>
+        <input type="radio" v-model="selectorVal.boolValue" value="true"/>
+        <label>True</label>
+      </div>
+      <div>
+        <input type="radio" v-model="selectorVal.boolValue" value="false"/>
+        <label>False</label>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+
+  export default {
+    mounted:function(){
+      //console.log('Selctor Value: '+ this.selectorVal.boolValue);
+      this.selectorVal.boolValue=this.selectorVal.boolValue;
+    },
+    props:{
+      selectorVal:{
+        type:Object,
+        default:function () {
+          return {
+            'boolValue':'false',
+          };
+        }
+      },
+      heading:{
+        type:String
+      },
+      selectorId:{
+        type:String,
+        default:'na'
+      }
+    }
+  }
+</script>
+<style>
+  .boolean-selector-main{
+    display: block;
+  }
+  .boolean-selector{
+    display: flex;
+    font-weight: 100;
+  }
+
+  .boolean-selector div{
+    display: flex;
+    margin-right: 25px;
+  }
+
+  .boolean-selector div label{
+    margin-left: 10px;
+    text-align: center;
+    font-weight: bold;
+    padding-top: 4px;
+  }
+
+  .boolean-selector-heading{
+    font-size:1.1em;
+    font-weight: 400;
+    margin-bottom: 10px;
+    color: black;
+    width: 100%;
+
+  }
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplication.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplication.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplication.vue
new file mode 100644
index 0000000..73f52d0
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplication.vue
@@ -0,0 +1,112 @@
+<template>
+  <div class="new_app">
+    <h3>Create A New Application</h3>
+    <div class="main">
+      <div class="tabs">
+        <div class="tab" v-bind:class="tabs['details']"><router-link class="link" :to="{name:'details'}"><label class="lbl">Details</label></router-link></div>
+        <div class="tab" v-bind:class="tabs['interface']" v-bind:obj="appInterfaceTabData"><router-link class="link" :to="{name:'interface'}"><label class="lbl">Interface</label></router-link></div>
+        <div class="tab" v-bind:class="tabs['deployments']"><router-link class="link" :to="{name:'deployments'}"><label class="lbl">Deployments</label></router-link></div>
+        <div class="tab" style="width: 100%"></div>
+      </div>
+      <transition mode="out-in">
+        <router-view :key="$route.path"></router-view>
+      </transition>
+    </div>
+  </div>
+</template>
+<script>
+  import ApplicationDetails from './ApplicationDetails.vue'
+  import ApplicationInterface from './ApplicationInterface.vue'
+  export default {
+    components: {
+      ApplicationDetails,ApplicationInterface
+    },
+    mounted:function () {
+      this.current_active_tab=this.$route.name;
+      this.previous_active_tab='';
+    },
+    data: function () {
+      return {
+        current_active_tab: 0,
+        previous_active_tab: -1,
+        appInterfaceTabData:{'inputFields':[]}
+      };
+    },
+    computed: {
+      tabs: function () {
+        var tabs_active = {
+          'details':'',
+          'interface':'',
+          'deployments':''
+        };
+        tabs_active[this.current_active_tab] = 'active';
+        if (tabs_active.hasOwnProperty(this.previous_active_tab)) {
+          tabs_active[this.previous_active_tab] = '';
+        }
+        return tabs_active;
+      }
+    },
+    watch:{
+      '$route' (to, from) {
+        this.previous_active_tab=from.name
+        this.current_active_tab=to.name
+
+      }
+    }
+  }
+</script>
+<style>
+  .new_app {
+    margin: 45px;
+    width: 70%;
+  }
+
+  .main {
+    width: 100%;
+    margin-top: 50px;
+  }
+
+  .tab {
+    text-align: center;
+    width: 120px;
+    margin-bottom: 15px;
+    border-bottom: solid #999999 1px;
+    color: #007BFF;
+  }
+
+  .tab .lbl:hover {
+    cursor: pointer;
+  }
+
+  .active .lbl:hover {
+    cursor: default;
+  }
+
+  .lbl {
+    margin: 10px;
+    color: inherit;
+  }
+
+  .link{
+    color: inherit;
+  }
+
+  .active {
+    color: #333333;
+    border-top: solid #999999 1px;
+    border-left: solid #999999 1px;
+    border-right: solid #999999 1px;
+    border-bottom: hidden;
+    border-top-right-radius: 3px;
+    border-top-left-radius: 3px;
+  }
+
+  .tabs {
+    display: flex;
+    width: 100%;
+  }
+
+
+
+
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplicationButtons.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplicationButtons.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplicationButtons.vue
new file mode 100644
index 0000000..0bedc37
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/admin/NewApplicationButtons.vue
@@ -0,0 +1,42 @@
+<template>
+  <div class="btns">
+    <input class="cancel" type="button" value="Cancel"/>
+    <input class="save" type="button" value="Save"/>
+  </div>
+</template>
+<style>
+  .btns{
+    margin-top:50px;
+    display: inline-block;
+    width: 100%;
+  }
+
+  .btns input{
+    float: right;
+    margin-left: 20px;
+    text-align: center;
+    border-color: #007BFF;
+    border-style: solid;
+    border-radius: 3px;
+    padding-top: 5px;
+    padding-bottom:5px;
+    padding-left:15px;
+    padding-right: 15px;
+  }
+
+  .btns input:hover{
+    background-color: #3ca41a;
+    color: #f1fff3;
+  }
+
+  .save{
+    background-color: #007BFF;
+    color: white;
+  }
+
+  .cancel{
+    color:  #007BFF;
+    background-color: white;
+  }
+
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboard.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboard.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboard.vue
new file mode 100644
index 0000000..254dac1
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboard.vue
@@ -0,0 +1,6 @@
+<template>
+<router-view>
+
+</router-view>
+</template>
+

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboardHome.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboardHome.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboardHome.vue
new file mode 100644
index 0000000..be1b768
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/AdminDashboardHome.vue
@@ -0,0 +1,90 @@
+<template>
+  <div class="new_app">
+    <div class="new_app_header">
+      <h4 style="display: inline-block">Application Catalog</h4>
+      <router-link :to="{name:'details'}"><button v-on="this.$emit('new_application')">New Application <span>+</span></button></router-link>
+    </div>
+    <div class="applications">
+      <h6 style="color: #666666;">APPLICATIONS</h6>
+      <div class="container-fluid">
+        <div class="row">
+        <DashboardItem
+          v-for="item in applications" v-bind:dashboard_item="item" v-bind:key="item.title">
+        </DashboardItem>
+          </div>
+      </div>
+
+    </div>
+  </div>
+</template>
+<script>
+  import DashboardItem from '../DashboardItem.vue'
+  import NewApplication from '../admin/NewApplication.vue'
+  export default {
+    data:function () {
+      return {
+        "applications":[]
+      };
+    },
+    components:{
+      DashboardItem,NewApplication
+    },
+    mounted:function () {
+      this.fetchApplications();
+    },
+    methods:{
+      fetchApplications:function () {
+        var convert=function (applications) {
+
+        };
+        this.$http.get('/api/applications').then(response => {
+          this.applications=response.body;
+        }, response => {
+          this.applications=[{
+            "appModuleId": "",
+            "appModuleName": "No Applications Found",
+            "appModuleDescription": "",
+            "appModuleVersion": ""
+          }]
+        });
+      },
+
+    }
+  }
+</script>
+<style>
+  .new_app {
+    margin: 45px;
+    width: 100%;
+  }
+
+  .new_app_header{
+    width: 100%;
+    display: inline;
+  }
+
+  .new_app_header button{
+    background-color: #2e73bc;
+    color: white;
+    border: solid #2e73bc 1px ;
+    border-radius: 3px;
+    float: right;
+    padding-right: 15px;
+    padding-left: 15px;
+    padding-bottom: 8px;
+    padding-top: 3px;
+  }
+
+  .new_app_header button:hover{
+    cursor: pointer;
+  }
+
+  .new_app_header button span{
+    font-weight: 900;
+    font-size: larger;
+  }
+
+  .applications{
+    margin-top: 50px;
+  }
+</style>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/ExperimentDashboard.vue
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/ExperimentDashboard.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/ExperimentDashboard.vue
new file mode 100644
index 0000000..2898745
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/dashboards/ExperimentDashboard.vue
@@ -0,0 +1,104 @@
+<template>
+  <div class="stage">
+    <main class="main-content">
+      <div class="container-fluid">
+        <h1 class="h4 mb-4">Dashboard</h1>
+      </div>
+      <div class="container-fluid">
+        <div class="row">
+          <DashboardItem
+            v-for="item in applications" v-bind:dashboard_item="item" v-bind:key="item.title" v-bind:height="height">
+          </DashboardItem>
+        </div>
+      </div>
+    </main>
+    <aside class="sidebar">
+      <header class="sidebar-header">
+        <h1 class="sidebar-header__title">Recent Experiments</h1>
+        <a href="#0" class="sidebar-header__action" v-on:click="views_all_click_handler">View all</a>
+      </header>
+
+      <ol class="feed">
+        <RecentExperiment v-for="experiment in experiments"
+                          v-if="experiment.index <default_experiment_count || view_all" v-bind:experiment="experiment"
+                          v-bind:key="experiment.name"></RecentExperiment>
+      </ol>
+    </aside>
+  </div>
+</template>
+<script>
+  import DashboardItem from '../DashboardItem.vue'
+  import RecentExperiment from '../RecentExperiment.vue'
+  import {addIndex} from '../../utils.js'
+
+  export default{
+    'name':'main-section',
+    components: {
+      DashboardItem, RecentExperiment
+    },
+    data:function () {
+
+      var data_returned={
+        "view_all": false,
+        "default_experiment_count": 3,
+        "height":180,
+        "applications":
+          [
+
+          ]
+        , "experiments": [
+          {
+            "name": "Gaussian",
+            "description": "My very first test experiment",
+            "status": "Failed",
+            "updated": "14 minutes ago"
+          },
+          {
+            "name": "Lampps",
+            "description": "A really BIG experiment That Has a Really Long Title",
+            "status": "Completed",
+            "updated": "20 hours ago"
+          },
+          {
+            "name": "Gromacs",
+            "description": "exp_4a56w4892s23r6p9y_1",
+            "status": "Created",
+            "updated": "2 days ago"
+          },
+          {
+            "name": "RandExpr",
+            "description": "exp_4a56w4892s23r6p9y_1",
+            "status": "Failed",
+            "updated": "5 days ago"
+          }
+        ]
+      };
+      addIndex(data_returned["experiments"]);
+      return data_returned;
+    },
+    mounted:function () {
+      this.fetchApplications();
+    },
+    methods: {
+      "views_all_click_handler": function () {
+        this.view_all = !this.view_all;
+      },
+      fetchApplications:function () {
+        var convert=function (applications) {
+
+        };
+        this.$http.get('/api/applications').then(response => {
+          this.applications=response.body;
+        }, response => {
+          this.applications=[{
+            "appModuleId": "",
+            "appModuleName": "No Applications Found",
+            "appModuleDescription": "",
+            "appModuleVersion": ""
+          }]
+        });
+      }
+
+    }
+  }
+</script>

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/main.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/main.js b/django_airavata/apps/admin/static/django_airavata_admin/src/main.js
new file mode 100644
index 0000000..35b0f10
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/main.js
@@ -0,0 +1,31 @@
+import Vue from 'vue';
+import VueResource from 'vue-resource';
+import VueRouter from 'vue-router';
+import Vuex from 'vuex';
+
+import ExperimentsDashboard from './components/dashboards/ExperimentDashboard.vue';
+import AdminDashboard from './components/dashboards/AdminDashboard.vue';
+
+import router from './router';
+import storeParams from './store';
+
+Vue.config.productionTip = false;
+
+Vue.use(VueResource);
+Vue.use(VueRouter);
+Vue.use(Vuex);
+
+var store=new Vuex.Store(storeParams);
+
+export function initializeApacheAiravataDashboard(dashboardName) {
+  return new Vue({
+    el: '#app',
+    router,
+    store,
+    template: '<' + dashboardName + '/>',
+    components: {ExperimentsDashboard, AdminDashboard}
+
+  })
+};
+
+

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/router.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/router.js b/django_airavata/apps/admin/static/django_airavata_admin/src/router.js
new file mode 100644
index 0000000..291151b
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/router.js
@@ -0,0 +1,34 @@
+import AdminDashboardHome from './components/dashboards/AdminDashboardHome.vue'
+import NewApplication from './components/admin/NewApplication.vue'
+import ExperimentsDashboard from './components/dashboards/ExperimentDashboard.vue'
+import ApplicationDetails from'./components/admin/ApplicationDetails.vue'
+import ApplicationInterface from './components/admin/ApplicationInterface.vue'
+import ApplicationDeployments from  './components/admin/ApplicationDeployments.vue'
+import VueRouter from 'vue-router'
+
+
+const routes=[
+  { path: '/new/application', component: NewApplication,name:'newapp',
+  children:[
+    {
+      path:'details',
+      component:ApplicationDetails,
+      name:'details',
+
+    },{
+      path:'interface',
+      component:ApplicationInterface,
+      name:'interface'
+    },{
+      path:'deployments',
+      component:ApplicationDeployments,
+      name:'deployments'
+
+    }
+  ]},
+  { path: '/', component: AdminDashboardHome },
+  {path:'/experiments',component:ExperimentsDashboard}
+];
+export default new VueRouter({
+  routes:routes
+});

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/store.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/store.js b/django_airavata/apps/admin/static/django_airavata_admin/src/store.js
new file mode 100644
index 0000000..0f082fa
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/store.js
@@ -0,0 +1,66 @@
+
+const store={
+  modules:{
+    appInterfaceTab:{
+      state:{
+        inputFields:[],
+        counter:0
+      },
+      mutations:{
+        createAppInterfaceInputField:function (state) {
+          state.inputFields.push(
+            {
+              input_id:state.counter++,
+              name:'',
+              value:'',
+              type:'',
+              appArg:'',
+              dataStaged:false,
+              requiredId:false,
+              requiredOnCmdId:false
+            }
+          );
+        }
+      },
+      getters:{
+        getAppInterface:state=>{
+          return state.data;
+        }
+      }
+    },
+    appDetailsTab:{
+      state:{
+        data:{},
+      },
+      mutations:{
+        addAppDetails:function (state,data) {
+          state.data=data;
+        }
+      },
+      getters:{
+        getAppDetails:(state,getters)=>{
+          return state.data;
+        }
+      }
+    },
+    appDeploymentsTab:{
+      state:{
+        data:{},
+      },
+      mutations:{
+        addAppDeployments:function (state,data) {
+          state.data=data;
+        }
+      },
+      getters:{
+        getAppDeployments:(state,getters)=>{
+          return state.data;
+        }
+      }
+    }
+  }
+};
+
+export default {
+  'store':store
+}

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/src/utils.js
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/utils.js b/django_airavata/apps/admin/static/django_airavata_admin/src/utils.js
new file mode 100644
index 0000000..076a033
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/utils.js
@@ -0,0 +1,8 @@
+
+
+export function addIndex(list){
+  for(var i=0;i<list.length;i++){
+      list[i].index=i;
+  }
+  return list;
+}

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/static/css/admin.css
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/static/css/admin.css b/django_airavata/apps/admin/static/django_airavata_admin/static/css/admin.css
new file mode 100644
index 0000000..55c2fdf
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/static/css/admin.css
@@ -0,0 +1,29 @@
+.entry{
+  margin-top:20px;
+  display: block;
+}
+
+.entry .heading{
+  font-size:16px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+
+.entry input,textarea{
+  width: 100%;
+  border-radius: 2px;
+  border: solid #dddddd 1px;
+  padding: 7px;
+}
+
+.main_section {
+  width: 100%;
+  display: block;
+  margin-top: 50px;
+  margin-bottom:20px;
+}
+
+.new-application-tab-main{
+  width: 65%;
+  margin-bottom:30px;
+}

http://git-wip-us.apache.org/repos/asf/airavata-django-portal/blob/d566ab8c/django_airavata/apps/admin/static/django_airavata_admin/static/css/main.css
----------------------------------------------------------------------
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/static/css/main.css b/django_airavata/apps/admin/static/django_airavata_admin/static/css/main.css
new file mode 100644
index 0000000..523b230
--- /dev/null
+++ b/django_airavata/apps/admin/static/django_airavata_admin/static/css/main.css
@@ -0,0 +1,145 @@
+html,
+body {
+  height: 100%; }
+
+body {
+  color: #333;
+  background-color: #f7f7f7; }
+
+.c-header {
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #ddd;
+  background-color: #ffffff; }
+  .c-header__logo {
+    margin-right: 1rem;
+    width: 70px;
+    background-color: #990000; }
+    .c-header__logo svg {
+      display: block; }
+  .c-header__title {
+    font-size: 1.25rem;
+    line-height: 1; }
+    .c-header__title a {
+      color: #333; }
+  .c-header__controls {
+    margin-left: auto;
+    margin-right: 2rem; }
+
+.c-nav {
+  background-color: #444;
+  min-width: 70px;
+  min-height: 60px;
+  padding: 1rem 0;
+  margin-top: -1px;
+  display: flex; }
+  .c-nav__item {
+    color: #ccc;
+    font-size: 1.5rem;
+    display: block;
+    text-align: center;
+    line-height: 1;
+    flex-grow: 1; }
+    .c-nav__item:hover, .c-nav__item:focus {
+      color: #ffffff; }
+    .c-nav__item:active {
+      color: #bbb; }
+    .c-nav__item.is-active {
+      color: #ffffff; }
+
+@media screen and (min-width: 768px) {
+  .c-nav {
+    height: 100%;
+    flex-direction: column; }
+    .c-nav__item {
+      flex-grow: 0;
+      margin-bottom: 2rem; } }
+.stage {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column; }
+
+@media screen and (min-width: 768px) {
+  .stage {
+    flex-direction: row; } }
+.main-content {
+  flex-grow: 1;
+  padding: 1rem; }
+
+.sidebar {
+  flex-basis: 200px;
+  background-color: #ffffff; }
+
+.sidebar-header {
+  padding: 1.5rem;
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid #eee; }
+  .sidebar-header__title {
+    font-size: .825rem;
+    text-transform: uppercase;
+    letter-spacing: .04rem;
+    margin: 0; }
+  .sidebar-header__action {
+    margin-left: auto;
+    font-size: .825rem; }
+
+@media screen and (min-width: 768px) {
+  .sidebar {
+    min-width: 310px;
+    border-left: 1px solid #ddd; } }
+.card {
+  background-color: #fff;
+  border-radius: 4px;
+  border: none;
+  box-shadow: 0 2px 0 #eee;
+  margin-bottom: 30px; }
+
+/**
+ * Make a small card text modifier so we can still use
+ * Bootstrap's default styles if needed.
+ */
+.card-text--small {
+  line-height: 1.4;
+  font-size: .825rem; }
+
+.card.is-disabled {
+  background-color: #ddd; }
+  .card.is-disabled .card-title {
+    color: #999999; }
+  .card.is-disabled .badge {
+    background-color: #ccc;
+    color: #999999; }
+
+.card-link:hover {
+  text-decoration: none;
+  background-color: #fafafa; }
+
+.card.is-disabled .card-link:hover {
+  background-color: #ddd;
+  cursor: not-allowed; }
+
+/**
+ * Feed
+ */
+.feed {
+  list-style: none;
+  margin: 0;
+  padding: 0; }
+  .feed__list-item {
+    padding: 1.5rem;
+    border-bottom: 1px solid #eee; }
+  .feed__label {
+    font-size: .825rem;
+    text-transform: uppercase; }
+  .feed__title {
+    font-size: 1rem;
+    margin: 0; }
+    .feed__title a {
+      color: #212529; }
+  .feed__item-meta {
+    margin: 0;
+    font-size: .825rem; }
+
+/*# sourceMappingURL=main.css.map */