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 2018/01/25 22:09:34 UTC
[airavata-django-portal] 01/06: AIRAVATA-2615 WIP Experiment
Summary view
This is an automated email from the ASF dual-hosted git repository.
machristie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
commit 264845ef446cc6abd5d029cd9fb5ce8efd568a47
Author: Marcus Christie <ma...@iu.edu>
AuthorDate: Thu Jan 18 12:59:39 2018 -0500
AIRAVATA-2615 WIP Experiment Summary view
---
.../js/models/ExperimentStatus.js | 16 +++
.../js/services/ExperimentService.js | 12 ++-
.../js/services/ProjectService.js | 10 +-
.../js/components/experiment/ExperimentSummary.vue | 109 +++++++++++++++++++++
.../js/containers/ViewExperimentContainer.vue | 37 +++++++
.../js/entry-view-experiment.js | 26 +++++
.../django_airavata_workspace/view_experiment.html | 19 ++++
django_airavata/apps/workspace/urls.py | 2 +
django_airavata/apps/workspace/views.py | 13 +++
django_airavata/apps/workspace/webpack.config.js | 1 +
10 files changed, 239 insertions(+), 6 deletions(-)
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentStatus.js b/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentStatus.js
index bc8f0bf..2b5efc7 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentStatus.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/ExperimentStatus.js
@@ -10,8 +10,24 @@ const FIELDS = [
'reason',
];
+const STATE_NAMES = {
+ 0: "CREATED",
+ 1: "VALIDATED",
+ 2: "SCHEDULED",
+ 3: "LAUNCHED",
+ 4: "EXECUTING",
+ 5: "CANCELING",
+ 6: "CANCELED",
+ 7: "COMPLETED",
+ 8: "FAILED",
+}
+
export default class ExperimentStatus extends BaseModel {
constructor(data = {}) {
super(FIELDS, data);
}
+
+ get stateName() {
+ return STATE_NAMES[this.state];
+ }
}
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/services/ExperimentService.js b/django_airavata/apps/api/static/django_airavata_api/js/services/ExperimentService.js
index 0aa81b5..a90295b 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/services/ExperimentService.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/services/ExperimentService.js
@@ -32,10 +32,14 @@ class ExperimentService {
}
}
- get() {
- return FetchUtils.get('/api/experiments/'
- + encodeURIComponent(experiment.experimentId) + '/')
- .then(result => new Experiment(result));
+ get(experimentId, data = null) {
+ if (data) {
+ return Promise.resolve(new Experiment(data));
+ } else {
+ return FetchUtils.get('/api/experiments/'
+ + encodeURIComponent(experimentId) + '/')
+ .then(result => new Experiment(result));
+ }
}
launch(experimentId) {
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/services/ProjectService.js b/django_airavata/apps/api/static/django_airavata_api/js/services/ProjectService.js
index c78c5a5..78c1825 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/services/ProjectService.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/services/ProjectService.js
@@ -33,8 +33,14 @@ class ProjectService {
// TODO
}
- get() {
- // TODO
+ get(projectId, data=null) {
+ if (data) {
+ return Promise.resolve(new Project(data));
+ } else {
+ return FetchUtils.get('/api/projects/'
+ + encodeURIComponent(projectId) + '/')
+ .then(result => new Project(result));
+ }
}
}
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentSummary.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentSummary.vue
new file mode 100644
index 0000000..ba9ecac
--- /dev/null
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/components/experiment/ExperimentSummary.vue
@@ -0,0 +1,109 @@
+<template>
+ <div>
+ <div class="row">
+ <div class="col">
+ <h1 class="h4 mb-4">
+ <slot name="title">Experiment Summary</slot>
+ </h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col">
+ <div class="card border-default">
+ <div class="card-body">
+ <table class="table">
+ <tbody>
+ <tr>
+ <th scope="row">Name</th>
+ <td><span :title="localExperiment.experimentId">{{ localExperiment.experimentName }}</span></td>
+ </tr>
+ <tr>
+ <th scope="row">Description</th>
+ <td>{{ localExperiment.description }}</td>
+ </tr>
+ <tr>
+ <th scope="row">Project</th>
+ <td>{{ project && project.name || '' }}</td>
+ </tr>
+ <tr>
+ <th scope="row">Outputs</th>
+ <td></td>
+ </tr>
+ <!-- Going to leave this out for now -->
+ <!-- <tr>
+ <th scope="row">Storage Directory</th>
+ <td></td>
+ </tr> -->
+ <tr>
+ <th scope="row">Owner</th>
+ <td>{{ localExperiment.userName }}</td>
+ </tr>
+ <tr>
+ <th scope="row">Application</th>
+ <td></td>
+ </tr>
+ <tr>
+ <th scope="row">Compute Resource</th>
+ <td></td>
+ </tr>
+ <tr>
+ <th scope="row">Experiment Status</th>
+ <td>{{ localExperiment.experimentStatus[0].stateName }}</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+
+import {models, services} from 'django-airavata-api'
+
+export default {
+ name: 'experiment-summary',
+ props: {
+ experiment: {
+ type: models.Experiment,
+ required: true
+ },
+ },
+ data () {
+ return {
+ localExperiment: this.experiment.clone(),
+ project: null,
+ }
+ },
+ components: {
+ },
+ computed: {
+ },
+ methods: {
+ loadProject: function() {
+ services.ProjectService.get(this.experiment.projectId)
+ .then(proj => this.project = proj);
+ },
+ loadApplication: function() {
+
+ },
+ loadOutputs: function() {
+
+ },
+ loadComputeHost: function() {
+
+ },
+ },
+ watch: {
+ },
+ mounted: function() {
+ console.log(JSON.stringify(this.experiment.experimentOutputs))
+ this.loadProject();
+ }
+}
+</script>
+
+<style>
+</style>
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ViewExperimentContainer.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ViewExperimentContainer.vue
new file mode 100644
index 0000000..1bf3482
--- /dev/null
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/containers/ViewExperimentContainer.vue
@@ -0,0 +1,37 @@
+<template>
+ <experiment-summary v-if="experiment" :experiment="experiment">
+ </experiment-summary>
+</template>
+
+<script>
+
+import {models, services} from 'django-airavata-api'
+import ExperimentSummary from '../components/experiment/ExperimentSummary.vue'
+
+export default {
+ name: 'view-experiment-container',
+ props: {
+ initialExperimentData: {
+ required: true
+ },
+ },
+ data () {
+ return {
+ experiment: null,
+ }
+ },
+ components: {
+ ExperimentSummary,
+ },
+ methods: {
+ },
+ computed: {
+ },
+ beforeMount: function () {
+ services.ExperimentService.get(this.initialExperimentData.experimentId, this.initialExperimentData)
+ .then(exp => this.experiment = exp);
+ }
+}
+</script>
+<style>
+</style>
diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/entry-view-experiment.js b/django_airavata/apps/workspace/static/django_airavata_workspace/js/entry-view-experiment.js
new file mode 100644
index 0000000..6517ba8
--- /dev/null
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/entry-view-experiment.js
@@ -0,0 +1,26 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import ViewExperimentContainer from './containers/ViewExperimentContainer.vue'
+
+// This is imported globally on the website so no need to include it again in this view
+// import 'bootstrap/dist/css/bootstrap.css'
+import 'bootstrap-vue/dist/bootstrap-vue.css'
+
+Vue.use(BootstrapVue);
+
+new Vue({
+ el: '#view-experiment',
+ template: '<view-experiment-container :initial-experiment-data="experiment"></view-experiment-container>',
+ data () {
+ return {
+ experiment: null,
+ }
+ },
+ components: {
+ ViewExperimentContainer,
+ },
+ beforeMount: function () {
+ console.log(this.$el.dataset.experimentData);
+ this.experiment = JSON.parse(this.$el.dataset.experimentData);
+ }
+})
diff --git a/django_airavata/apps/workspace/templates/django_airavata_workspace/view_experiment.html b/django_airavata/apps/workspace/templates/django_airavata_workspace/view_experiment.html
new file mode 100644
index 0000000..e09bf11
--- /dev/null
+++ b/django_airavata/apps/workspace/templates/django_airavata_workspace/view_experiment.html
@@ -0,0 +1,19 @@
+{% extends './base.html' %}
+
+{% load static %}
+
+{% block css %}
+{{ block.super }}
+<link rel=stylesheet type=text/css href="{% static 'django_airavata_workspace/dist/view-experiment.css' %}">
+{% endblock %}
+
+{% block content %}
+
+<div id="view-experiment" data-experiment-data="{{ experiment_data }}"></div>
+
+{% endblock content %}
+
+{% block scripts %}
+{{ block.super }}
+<script src="{% static "django_airavata_workspace/dist/view-experiment.js" %}"></script>
+{% endblock %}
diff --git a/django_airavata/apps/workspace/urls.py b/django_airavata/apps/workspace/urls.py
index fe8848f..a3aabc1 100644
--- a/django_airavata/apps/workspace/urls.py
+++ b/django_airavata/apps/workspace/urls.py
@@ -6,6 +6,8 @@ from . import views
app_name = 'django_airavata_workspace'
urlpatterns = [
url(r'^projects$', views.projects_list, name='projects'),
+ url(r'^experiments/(?P<experiment_id>[^/]+)/$', views.view_experiment,
+ name='view_experiment'),
url(r'^experiments$', views.experiments_list, name='experiments'),
url(r'^applications/(?P<app_module_id>[^/]+)/create_experiment$', views.create_experiment, name='create_experiment'),
url(r'^dashboard$', views.dashboard, name='dashboard'),
diff --git a/django_airavata/apps/workspace/views.py b/django_airavata/apps/workspace/views.py
index 74c6b9f..50c755d 100644
--- a/django_airavata/apps/workspace/views.py
+++ b/django_airavata/apps/workspace/views.py
@@ -6,6 +6,7 @@ from django.conf import settings
from django.contrib.auth.decorators import login_required
from django.shortcuts import render, redirect
+from django_airavata.apps.api.views import ExperimentViewSet
from django_airavata.apps.api.views import ProjectViewSet
logger = logging.getLogger(__name__)
@@ -39,3 +40,15 @@ def create_experiment(request, app_module_id):
return render(request, 'django_airavata_workspace/create_experiment.html', {
'app_module_id': app_module_id
})
+
+@login_required
+def view_experiment(request, experiment_id):
+ request.active_nav_item = 'experiments'
+
+ response = ExperimentViewSet.as_view(
+ {'get': 'retrieve'})(request, experiment_id=experiment_id)
+ experiment_json = JSONRenderer().render(response.data)
+
+ return render(request, 'django_airavata_workspace/view_experiment.html', {
+ 'experiment_data': experiment_json
+ })
diff --git a/django_airavata/apps/workspace/webpack.config.js b/django_airavata/apps/workspace/webpack.config.js
index 2bbacb6..b200ad7 100644
--- a/django_airavata/apps/workspace/webpack.config.js
+++ b/django_airavata/apps/workspace/webpack.config.js
@@ -8,6 +8,7 @@ module.exports = {
'project-list': './static/django_airavata_workspace/js/entry-project-list',
'dashboard': './static/django_airavata_workspace/js/entry-dashboard',
'create-experiment': './static/django_airavata_workspace/js/entry-create-experiment',
+ 'view-experiment': './static/django_airavata_workspace/js/entry-view-experiment',
},
output: {
path: path.resolve(__dirname, './static/django_airavata_workspace/dist/'),
--
To stop receiving notification emails like this one, please contact
machristie@apache.org.