diff --git a/.gitignore b/.gitignore
index 8798cb4..775d7a6 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,12 +1,7 @@
 .DS_Store
-/vue_app/node_modules
-/vue_app/dist
-/node_server/node_modules
-/vue_app/package-lock.json
-/node_server/package-lock.json
-
-/vue_app/tests/e2e/reports/
-selenium-debug.log
+/node_modules
+/dist
+/package-lock.json
 
 # local env files
 .env.local
diff --git a/Dockerfile b/Dockerfile
deleted file mode 100644
index 5314d5b..0000000
--- a/Dockerfile
+++ /dev/null
@@ -1,24 +0,0 @@
-FROM ubuntu:16.04
-LABEL Name=OSCAR-UI Version=1.0.0
-
-RUN apt-get update -y &&\
-    apt-get install -y curl  &&\
-    curl --silent --location https://deb.nodesource.com/setup_8.x |su - && \
-    apt-get install -y nodejs build-essential vim mc
-    
-RUN apt-get install -y gettext
-COPY vue_app/. /usr/src/vue_app/.
-RUN cd /usr/src/vue_app; npm install && npm run build
-COPY node_server/.  /usr/src/node_server/.
-RUN cd /usr/src/node_server; npm install && mkdir static
-RUN cp -r /usr/src/vue_app/dist/. /usr/src/node_server/static/.
-COPY entrypoint.sh /
-RUN ["chmod", "+x", "entrypoint.sh"]
-EXPOSE 3000
-CMD ["sh","-c","/entrypoint.sh && cd /usr/src/node_server && npm start"]
-
-
-
-
-
-
diff --git a/README.md b/README.md
index c9f9303..a8ec413 100644
--- a/README.md
+++ b/README.md
@@ -1,11 +1,22 @@
-# OSCAR-UI - A UI for the OSCAR framework
-[![License](https://img.shields.io/badge/license-Apache%202-blue.svg)](https://www.apache.org/licenses/LICENSE-2.0)
+# oscar-ui
 
-## Introduction
-OSCAR-UI is a Vue.js-based user interface for the [OSCAR](https://github.com/grycap/oscar) framework. It is intended to be run inside a Kubernetes cluster in order to provide a unified web-based graphical user interface to interact with the [OSCAR Manager](https://o-scar.readthedocs.io/en/latest/intro.html#architecture) and the underlying data-storage back-end (e.g. Minio).
+User interface for [OSCAR](https://github.com/grycap/oscar).
+
+Note: In the src/env.js path there are variables that the web needs to connect with the api, and with the EGI Check-in client. Also to change the values of the MINIO client, go to src/components/services.js
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
 
-## Licensing
 
-OSCAR-UI is licensed under the Apache License, Version 2.0. See
-[LICENSE](https://github.com/grycap/scar/blob/master/LICENSE) for the full
-license text.
\ No newline at end of file
diff --git a/vue_app/babel.config.js b/babel.config.js
similarity index 100%
rename from vue_app/babel.config.js
rename to babel.config.js
diff --git a/entrypoint.sh b/entrypoint.sh
deleted file mode 100644
index b9eea1e..0000000
--- a/entrypoint.sh
+++ /dev/null
@@ -1,66 +0,0 @@
-#!/bin/sh
-
-# Replace env vars in JavaScript files
-echo "Replacing env vars in JS"
-for file in /usr/src/node_server/static/js/routes.*.js;
-do
-  echo "Processing $file ...";
-
-  # Use the existing JS file as template
-  if [ ! -f $file.tmpl.js ]; then
-    cp $file $file.tmpl.js
-  fi
-
-  envsubst '$VUE_APP_BACKEND_HOST' < $file.tmpl.js > $file
-done
-
-for file in  /usr/src/node_server/static/js/routes.*.js.map;
-do
-  echo "Processing $file ...";
-
-  # Use the existing JS file as template
-  if [ ! -f $file.tmpl.js.map ]; then
-    cp $file $file.tmpl.js.map
-  fi
-
-  envsubst '$VUE_APP_BACKEND_HOST' < $file.tmpl.js.map > $file
-done
-
-for file in  /usr/src/node_server/static/js/app.*.js;
-do
-  echo "Processing $file ...";
-
-  # Use the existing JS file as template
-  if [ ! -f $file.tmpl.js.map ]; then
-    cp $file $file.tmpl.js.map
-  fi
-
-  envsubst '$VUE_APP_BACKEND_HOST' < $file.tmpl.js.map > $file
-done
-
-for file in  /usr/src/node_server/static/js/app.*.js.map;
-do
-  echo "Processing $file ...";
-
-  # Use the existing JS file as template
-  if [ ! -f $file.tmpl.js.map ]; then
-    cp $file $file.tmpl.js.map
-  fi
-
-  envsubst '$VUE_APP_BACKEND_HOST' < $file.tmpl.js.map > $file
-done
-
-for file in  /usr/src/node_server/routes/index.js;
-do
-  echo "Processing $file ...";
-
-  # Use the existing JS file as template
-  if [ ! -f $file.tmpl.js.map ]; then
-    cp $file $file.tmpl.js.map
-  fi
-
-  envsubst '\$MINIO_ACCESS_KEY \$MINIO_SECRET_KEY' < $file.tmpl.js.map > $file  
-done
-
-echo "Finish"
-
diff --git a/vue_app/jest.config.js b/jest.config.js
similarity index 100%
rename from vue_app/jest.config.js
rename to jest.config.js
diff --git a/node_server/app.js b/node_server/app.js
deleted file mode 100644
index ef668c5..0000000
--- a/node_server/app.js
+++ /dev/null
@@ -1,53 +0,0 @@
-var createError = require('http-errors');
-var express = require('express');
-var path = require('path');
-var cookieParser = require('cookie-parser');
-var logger = require('morgan');
-var Minio = require ('minio');
-    
-
-var indexRouter = require('./routes/index');
-var usersRouter = require('./routes/users');
-
-var app = express();
-
-
-
-
-// view engine setup
-app.use(function(req, res, next) {
-  res.header("Access-Control-Allow-Origin", "*");
-  res.header("Access-Control-Allow-Headers", "*");
-  res.header("Access-Control-Allow-Methods", "GET,DELETE,POST,PUT");
-  next();
- });
-app.set('views', path.join(__dirname, 'views'));
-app.set('view engine', 'jade');
-
-app.use(logger('dev'));
-app.use(express.json());
-app.use(express.urlencoded({ extended: false }));
-app.use(cookieParser());
-// app.use(express.static(path.join(__dirname, 'public')));
-app.use(express.static('static'));
-
-app.use('/', indexRouter);
-app.use('/users', usersRouter);
-
-// catch 404 and forward to error handler
-app.use(function(req, res, next) {
-  next(createError(404));
-});
-
-// error handler
-app.use(function(err, req, res, next) {
-  // set locals, only providing error in development
-  res.locals.message = err.message;
-  res.locals.error = req.app.get('env') === 'development' ? err : {};
-
-  // render the error page
-  res.status(err.status || 500);
-  res.render('error');
-});
-
-module.exports = app;
diff --git a/node_server/bin/www b/node_server/bin/www
deleted file mode 100755
index df6aa88..0000000
--- a/node_server/bin/www
+++ /dev/null
@@ -1,99 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * Module dependencies.
- */
-
-var app = require('../app');
-var debug = require('debug')('test3:server');
-var https = require('https');
-var fs = require ('fs');
-var path = require('path');
-/**
- * Get port from environment and store in Express.
- */
-
-var port = normalizePort(process.env.PORT || '3001');
-app.set('port', port);
-
-/**
- * GET key and certificate for HTTPS Server.
- */
-
-var privateKey  = fs.readFileSync(path.resolve('ssl/localhost.key'));
-var certificate = fs.readFileSync(path.resolve('ssl/localhost.cert'))
-var credentials = {key: privateKey, cert: certificate};
-
-/**
- * Create HTTPS server.
- */
-
-var server = https.createServer(credentials,app);
-
-/**
- * Listen on provided port, on all network interfaces.
- */
-
-server.listen(port);
-server.on('error', onError);
-server.on('listening', onListening);
-
-/**
- * Normalize a port into a number, string, or false.
- */
-
-function normalizePort(val) {
-  var port = parseInt(val, 10);
-
-  if (isNaN(port)) {
-    // named pipe
-    return val;
-  }
-
-  if (port >= 0) {
-    // port number
-    return port;
-  }
-
-  return false;
-}
-
-/**
- * Event listener for HTTP server "error" event.
- */
-
-function onError(error) {
-  if (error.syscall !== 'listen') {
-    throw error;
-  }
-
-  var bind = typeof port === 'string'
-    ? 'Pipe ' + port
-    : 'Port ' + port;
-
-  // handle specific listen errors with friendly messages
-  switch (error.code) {
-    case 'EACCES':
-      console.error(bind + ' requires elevated privileges');
-      process.exit(1);
-      break;
-    case 'EADDRINUSE':
-      console.error(bind + ' is already in use');
-      process.exit(1);
-      break;
-    default:
-      throw error;
-  }
-}
-
-/**
- * Event listener for HTTP server "listening" event.
- */
-
-function onListening() {
-  var addr = server.address();
-  var bind = typeof addr === 'string'
-    ? 'pipe ' + addr
-    : 'port ' + addr.port;
-  debug('Listening on ' + bind);
-}
diff --git a/node_server/package.json b/node_server/package.json
deleted file mode 100644
index 4dd618b..0000000
--- a/node_server/package.json
+++ /dev/null
@@ -1,28 +0,0 @@
-{
-  "name": "test3",
-  "version": "0.0.0",
-  "private": true,
-  "scripts": {
-    "start": "node ./bin/www"
-  },
-  "dependencies": {
-    "archiver": "^3.0.0",
-    "aws-sdk": "^2.327.0",
-    "axios": "^0.18.0",
-    "cookie-parser": "~1.4.3",
-    "debug": "~2.6.9",
-    "download": "^7.1.0",
-    "express": "~4.16.0",
-    "fs": "0.0.1-security",
-    "http-errors": "~1.6.2",
-    "https": "^1.0.0",
-    "jade": "~1.11.0",
-    "minio": "^7.0.1",
-    "morgan": "~1.9.0",
-    "multer": "^1.4.0",
-    "node-zip": "^1.1.1",
-    "path": "^0.12.7",
-    "request": "^2.88.0",
-    "xmlhttprequest": "^1.8.0"
-  }
-}
diff --git a/node_server/public/stylesheets/style.css b/node_server/public/stylesheets/style.css
deleted file mode 100644
index 9453385..0000000
--- a/node_server/public/stylesheets/style.css
+++ /dev/null
@@ -1,8 +0,0 @@
-body {
-  padding: 50px;
-  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
-}
-
-a {
-  color: #00B7FF;
-}
diff --git a/node_server/routes/index.js b/node_server/routes/index.js
deleted file mode 100644
index 6473625..0000000
--- a/node_server/routes/index.js
+++ /dev/null
@@ -1,347 +0,0 @@
-var express = require('express');
-var router = express.Router();
-const axios = require('axios');
-var Minio = require ('minio');
-let multer = require('multer');
-let upload = multer();
-var fs = require ('fs');
-var archiver = require('archiver');
-var path = require('path');
-const download = require('download');
-
-var app = express();
-
-// /************************OPENFAAS*******************************/
-// /* GET home page. */
-
-// router.get('/', function(req, res, next) {
-//    res.render('index', { title: 'Express' });
-// });
-
-// router.post('/chargeurl', function(req, res, next) { 
-
-// var url = req.body["url"] 
-// download(url).then(data => {
-//     var filename = url.split("/");
-//     fs.writeFileSync(path.join(__dirname,filename[filename.length-1]), data);
-//     fs.readFile(path.join(__dirname,filename[filename.length-1]), 'utf8', function(err, data) {  
-//       if (err) throw err;      
-//       res.write(data)
-//       res.end()
-//   });
-//   fs.unlinkSync(path.join(__dirname,'/',filename[filename.length-1]), function(error){
-//     if (error){
-//     throw error;
-//     }
-//     console.log("Delete success")    
-//   })
-// }); 
-// });
-
-
-// router.post('/newfaas', (req, res, next) => {  
-// var params = {name:req.body['service'], 
-// network:req.body['network'], 
-// image:req.body['image'], 
-// // envProcess:req.body['envProcess'], 
-// script:req.body['script'],
-// annotations: req.body['annotations'],
-// constraints: req.body['constraints'],
-// envVars: req.body['envVars'],
-// limits: req.body['limits'],
-// labels: req.body['labels'],
-// registryAuth: req.body['registryAuth'],
-// requests: req.body['requests'],
-// secrets: req.body['secrets']
-// }
-// console.log(params)
-// axios.post(
-//   req.body['url'], 
-//   {name:req.body['service'], 
-//   network:req.body['network'], 
-//   image:req.body['image'], 
-//   // envProcess:req.body['envProcess'], 
-//   script:req.body['script'],
-//   annotations: req.body['annotations'],
-//   constraints: req.body['constraints'],
-//   envVars: req.body['envVars'],
-//   limits: req.body['limits'],
-//   labels: req.body['labels'],
-//   registryAuth: req.body['registryAuth'],
-//   requests: req.body['requests'],
-//   secrets: req.body['secrets']
-// })
-//     .then((response) => {
-//     // handle success        
-//     res.status(200).json(response.data);              
-//     })
-//     .catch((error) => {   
-//     var err = error.response.data
-//     console.log(err)
-//     res.status(400).json(err)        
-//   }) 
-// });
-
-// router.post('/loadfaas', (req, res, next) => {     
-
-//     axios.get(req.body['url'])
-//     .then((response) => {
-//     // handle success        
-//     res.status(200).json(response.data);              
-//     })
-//     .catch((error) => {
-//      // handle error
-//     console.log(error) 
-//     res.status(400).json(error.response)        
-//   }) 
-  
-// });
-// router.delete('/deletefaas', (req, res, next) => {
-//   var funct = req.body['functionName']
-//   axios.delete(req.body['url'], {data: {name: funct} })
-//   .then((response) => {
-//     // handle success    
-//     res.status(200).json(response.data);         
-    
-//   })
-//   .catch((error) => {
-//     //handle error   
-//     res.status(400).json(error.response)        
-//   }) 
-// });
-
-// router.put('/editfaas', (req, res, next) => {  
-  
-//   axios.put(req.body['url'], 
-//   {name:req.body['service'], 
-//   network:req.body['network'], 
-//   image:req.body['image'], 
-//   // envProcess:req.body['envProcess'], 
-//   script:req.body['script'],
-//   annotations: req.body['annotations'],
-//   constraints: req.body['constraints'],
-//   envVars: req.body['envVars'],
-//   limits: req.body['limits'],
-//   labels: req.body['labels'],
-//   registryAuth: req.body['registryAuth'],
-//   requests: req.body['requests'],
-//   secrets: req.body['secrets']
-// })
-//   .then((response) => {
-//     // handle success    
-//     res.status(200).json(response.data);              
-    
-//   })
-//   .catch((error) => {
-//     // handle error    
-//     res.status(400).json(error)        
-//   }) 
-// });
-
-
-/************************MINIO*******************************/
-
-
-// var minioClient = new Minio.Client({
-//     endPoint: '158.42.105.147',    
-//     port: 30300,   
-//     useSSL: false,
-//     accessKey: "minioooo",
-//     secretKey: "M2CvXmUjVbm1q5aIVumS"
-// });
-
-var minioClient = new Minio.Client({
-  endPoint: 'play.min.io',
-  port: 9000,
-  useSSL: true,
-  accessKey: 'Q3AM3UQ867SPQQA43P2F',
-  secretKey: 'zuf+tfteSlswRu7BJ86wekitnifILbZam1KYY3TG'
-});
-// console.log(minioClient)
-
-
-
-// var minioClient = new Minio.Client({
-//   endPoint: 'minio-service.minio',    
-//   port: 9000,   
-//   useSSL: false,
-//   accessKey: "$MINIO_ACCESS_KEY",
-//   secretKey: "$MINIO_SECRET_KEY"
-// });
-
-router.post('/listbuckets', (req, res, next) => { 
-  console.log("buckets")  
-        minioClient.listBuckets(function(err, buckets) {
-          if (err) return console.log(err)
-          console.log('buckets :', buckets)
-        })  
-      // minioClient.listBuckets((err, buckets) => {
-      //   // if (err) return res.status(400).json(err)
-      //   if (err) return res.status(400).json(err)
-      //   res.status(200).json(buckets);        
-        
-      // })
-  }); 
-
-// router.post('/bucketExists', (req, res, next) => {        
-//       minioClient.bucketExists(req.body["name"], function(err, exists) {
-//         if (err) return res.status(400).json(err)        
-//         res.status(200).json(exists);        
-          
-//       })
-//   }); 
-
-// router.post('/removeFile', (req, res, next) => { 
-//       console.log(req.body["fileName"])     
-//       console.log(req.body["bucketName"]) 
-       
-//       var objectList = [];
-//       objectList = req.body["fileName"]
-//       console.log(objectList)
-//       for  (var i=0; i < objectList.length; i++) {
-//       minioClient.removeObject(req.body["bucketName"], objectList[i], function(err, exists) {
-//         if (err){ 
-//         console.log(err)
-//         res.status(400).json(err)            
-//         }else{
-//         res.status(200).json(exists);        
-//         }
-            
-//       })
-//     }
-//   }); 
-
-// router.post('/makeBucket', (req, res, next) => {          
-//     minioClient.makeBucket(req.body["name"], function(err, exists) {
-//       console.log(exists)
-//       if (err) return res.status(400).json(err)            
-//       res.status(200).json(exists);        
-          
-//     })
-// }); 
-
-// router.post('/removeBucket', (req, res, next) => {          
-//   minioClient.removeBucket(req.body["name"], function(err, exists) {
-    
-//     if (err) return res.status(400).json(err)            
-//     res.status(200).json(exists);        
-        
-//   })
-// });
-
-// router.post('/listObjects', (req, res, next) => {  
-//   console.log(req.body["name"])        
-//   let stream= minioClient.listObjects(req.body["name"], '', true) 
-    
-//     var funct = {
-//       err : "",
-//       files: []
-//     };
-//     var files = [];
-//     stream.on('data', function(obj) 
-//     {       
-//       funct.files.push(obj);
-      
-//     })    
-//     stream.on('error', function(err) 
-//     {       
-//       funct["err"] = err;
-//       console.log(err);
-//     })
-//     stream.on('end', function(e) 
-//     {       
-//       res.status(200).json(funct);
-//     })
-    
-    
-// });
-
-
-
-// router.post('/minioUpload', upload.any(), (req, res, next) => {   
-//   var file = req.files; 
-
-//    minioClient.putObject(req.body["bucketName"],file[0].originalname,file[0].buffer, function(err, data) {
-//       if (err){
-//        console.log(err)
-//        res.status(400).json({key: req.body["key"], err : err, name : file[0].originalname})
-//       }else{   
-//       console.log(data)
-//        res.status(200).json({
-//             key: req.body["key"], 
-//             // etag: data.ETag.replace(/[^A-Z0-9]+/ig, ""), 
-//             etag: data, 
-//             name : file[0].originalname
-//         });
-//       }
-// });
-    
-    
-// });
-
-// router.post('/downloadFile', (req, res, next) => {   
-//   console.log(req.body["bucketName"])
-//   console.log(req.body["fileName"]) 
-//   console.log(req.body["fileName"].length)
-//   var data = {};
-  
-//   if(req.body["select"]==1){
-//   for  (var i=0; i < req.body["fileName"].length; i++) {
-//     minioClient.getObject(req.body["bucketName"], req.body["fileName"][i], function(error, stream) {
-//     if(error) {
-//        console.log(error)
-//         return res.status(500).send(error);
-//     }
-//     console.log('sucess')    
-//     stream.pipe(res)   
-//     });   
-//   }
-//   }else{
-//     nextFile(0,req,res)
-//   }
-
-// });
-// function nextFile(i, req, res){  
-// 	minioClient.fGetObject(req.body["bucketName"], req.body["fileName"][i], path.join(__dirname , '/' ,req.body["fileName"][i]), function(err) {
-//         if (err) {
-//           return console.log(err)
-//         } 
-        
-//       if(i < req.body["fileName"].length - 1){
-// 			nextFile(i+1, req, res)
-// 		}else{
-// 			zipFile(req, res);
-// 		}
-        
-// 	})
-// } 
-
-// function zipFile(req, res){
-// 	/*Compress files*/ 
-// 	var archive = archiver('zip');
-// 	archive.on('error', function(err) {
-// 	  res.status(500).send({error: err.message});
-// 	});
-// 	//on stream closed we can end the request
-// 	archive.on('end', function() {
-// 	  console.log('Archive wrote %d bytes', archive.pointer());
-// 	  /*Delete files */
-// 	  for  (var i=0; i < req.body["fileName"].length; i++){
-// 		fs.unlinkSync(path.join(__dirname + '/' + req.body["fileName"][i]), function(error){
-// 		  if (error){
-// 			throw error;
-// 		  }
-// 		  console.log("Delete success")    
-// 		})
-// 	  }
-// 	  download_finish = false
-// 	});
-// 	archive.pipe(res);  
-// 	// add a file
-// 	for  (var i=0; i < req.body["fileName"].length; i++){
-// 		archive.file(path.join(__dirname, req.body["fileName"][i]), { name: req.body["fileName"][i] });
-// 	}
-// 	archive.finalize();
-// }
-
-module.exports = router;
diff --git a/node_server/routes/users.js b/node_server/routes/users.js
deleted file mode 100644
index 623e430..0000000
--- a/node_server/routes/users.js
+++ /dev/null
@@ -1,9 +0,0 @@
-var express = require('express');
-var router = express.Router();
-
-/* GET users listing. */
-router.get('/', function(req, res, next) {
-  res.send('respond with a resource');
-});
-
-module.exports = router;
diff --git a/node_server/ssl/localhost.cert b/node_server/ssl/localhost.cert
deleted file mode 100644
index 7fa832c..0000000
--- a/node_server/ssl/localhost.cert
+++ /dev/null
@@ -1,18 +0,0 @@
------BEGIN CERTIFICATE-----
-MIIC+zCCAeOgAwIBAgIJAMIUEkrKmXBNMA0GCSqGSIb3DQEBCwUAMBQxEjAQBgNV
-BAMMCWxvY2FsaG9zdDAeFw0xODEwMTgyMDIzMzBaFw0yODEwMTUyMDIzMzBaMBQx
-EjAQBgNVBAMMCWxvY2FsaG9zdDCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoC
-ggEBAMEdljr8yKVLv52uIixO2lNbKa5SoakD3BCIufZtaNjpGdrTVOQnp7be3NEC
-YT4YJpIWr9jQVuGVUHB0A9tIVoVVnupoSdlsJKOdFJVBAzAoaWP6Sa3sUPgxpiy7
-GFHJdcjdd+UAalA/wJQDm0cy8MGdcXELEI513vUySysYIfqN57GSQw6FWFLAQUwh
-msfOkyGTtFTJduBpEG7n+y0NT9cGN1VgU8sm57tJ4p42ozjRcuO4qDr57IR61TqA
-apfZXbbiwmF34+9iQaHOXWTTujp9jzlTduWaYUW3wbx5iDyQesumxJNoLsYdJ6xP
-woyF/AK/vl5P/yPLntivFsBl8gsCAwEAAaNQME4wHQYDVR0OBBYEFJYZAOlI7TJH
-YAJPQjP3WMeG7yfRMB8GA1UdIwQYMBaAFJYZAOlI7TJHYAJPQjP3WMeG7yfRMAwG
-A1UdEwQFMAMBAf8wDQYJKoZIhvcNAQELBQADggEBAE/TOcG47yVX/d3rc3pwbXm1
-T7Mbbw1W6pGZ31nWLBp3PFuBLHZsYfbPz3NrACQ3LjC4eKhIbpkjL74HVRi7G0PN
-+GN83qjwiUQJtoAgLv6PZNQn2RqtDytJbfrATTAE4QeyF47nqcrNzKnYW4xx+bvA
-Lz8QN+EBuAgoQejhOPy3+Ymc7MUWLUypkbb5agm0pjfIbPD74ErLX/U0mqddNZsY
-FH5y6JSgMldZLsYl4ViZ72IWvdMDDZiZYsDfJ38XPjcJoz4nrUmBT/+hlempEiNs
-wuuBKK+ciRs2N6v/iVdBjtxOct09VlySQau0+WO92Jhsn0kSoTuI5okmvqBppbg=
------END CERTIFICATE-----
diff --git a/node_server/ssl/localhost.key b/node_server/ssl/localhost.key
deleted file mode 100644
index 1a25a8d..0000000
--- a/node_server/ssl/localhost.key
+++ /dev/null
@@ -1,27 +0,0 @@
------BEGIN RSA PRIVATE KEY-----
-MIIEpAIBAAKCAQEAwR2WOvzIpUu/na4iLE7aU1sprlKhqQPcEIi59m1o2OkZ2tNU
-5Centt7c0QJhPhgmkhav2NBW4ZVQcHQD20hWhVWe6mhJ2Wwko50UlUEDMChpY/pJ
-rexQ+DGmLLsYUcl1yN135QBqUD/AlAObRzLwwZ1xcQsQjnXe9TJLKxgh+o3nsZJD
-DoVYUsBBTCGax86TIZO0VMl24GkQbuf7LQ1P1wY3VWBTyybnu0ninjajONFy47io
-OvnshHrVOoBql9ldtuLCYXfj72JBoc5dZNO6On2POVN25ZphRbfBvHmIPJB6y6bE
-k2guxh0nrE/CjIX8Ar++Xk//I8ue2K8WwGXyCwIDAQABAoIBADeuIDLBz9hZDtaX
-7qJ32dtO3aW1jYb95eWehn/W6/QewaWmaUOfa2v+tgxNc1xD+lsEz47kAyjntFm4
-GaSQJuIq3bcYerKFy8qg795Y8GJiRIDfGX9cM7xcFF2xVEHApIVV1cvhYsXgm9YR
-dCQDPAeXLa46UnvA4Jgx+BpkyudCosy6yH7lNRKTwwYCAQj+iGRQv1ZFI4ltaaxN
-Sp3a2xbEJCW3jyPLtyCeTIiEAa//uwmnlRzBjfmNRGPbbr26tMJZQlXeDiBWBM3B
-t8LmlYEKPb/q45drVy3SbvS9j7WE7vdaEP9kn2xPNgvTzFFnm/tM5QL4XEjmBCP0
-8M1hggECgYEA5sdMZiHgTeHzneiTABgBEJ8dJZ/2bgoVhUh8SWBwWTnPyR8cu4Qc
-OjmkuoF7TiEyvxxB9M/N5FGqJ26YLhKMXK3kxNt6guM5fTsXoyO+I90K9/UUEKk+
-Fi+nOqDZkRti5jIiXm3c/WUPghzJ5yVDm8ICqndxjbq0nK8Bbl076NsCgYEA1jiO
-15dFLTwBdABtV/2gnt4H9SQuYG4MnocA88MAVmcIHJMZCwJlkj5f1JCxqA8lmP1n
-HEY7Ruj2bIjt1kzQVIecKmfapHu8v5TL5VP3IFdhsxd6GGK+EtHetyH1T4c2MLib
-6c/YYJ8RFUMWi8eqrPLMrj2cVvK0a5esE3AjipECgYEAi6VjtJWhLl+g1BfNBAyC
-cHVn5MGUE+gkN5+yHZCuyz8xXelmsI1zq0QASx9Y5uEt3PkTbDlmxFcqWGwSyCZP
-KzHKsdiBnLw0qHPejMhvITJ7lamGd8KBoFk7nz2ACc+Bm/wQUgW26NqDdN9IyYcC
-Dzlp9Y8LdpDZA8reWdMvEmsCgYEAgRCQVyoHfqphgb9kIZhodm71QmfrHSQQrE5Q
-b4z0HhpzU6v4cZ6fDY5Q9GO89bEyiMtbnThfLGjdVyTkjrG27sbJeu8ZVvJKFO8U
-LXX6NV0QOvORFzIerH4PfiySfLjNGGuRXDxidExB4ZqK8ep5VTvvv6bVE7mkpBI8
-lXWBpFECgYBUpI8Kz0igtNmxVA33/RiRys24cZ+p2YQsLpB6RkIAcBKXebHKTlVJ
-KxXsf+o5M9L0cz5WFivKU4mY0GUglq5KMv0Uk2qGA9buQzviO6VGD17JQtcQzFVj
-4qzpo2zqgYw2k6HHE/IsLpKulvlHumEyA9nri6jqbjjr5u2MKV/abg==
------END RSA PRIVATE KEY-----
diff --git a/node_server/views/error.jade b/node_server/views/error.jade
deleted file mode 100644
index 51ec12c..0000000
--- a/node_server/views/error.jade
+++ /dev/null
@@ -1,6 +0,0 @@
-extends layout
-
-block content
-  h1= message
-  h2= error.status
-  pre #{error.stack}
diff --git a/node_server/views/index.jade b/node_server/views/index.jade
deleted file mode 100644
index 3d63b9a..0000000
--- a/node_server/views/index.jade
+++ /dev/null
@@ -1,5 +0,0 @@
-extends layout
-
-block content
-  h1= title
-  p Welcome to #{title}
diff --git a/node_server/views/layout.jade b/node_server/views/layout.jade
deleted file mode 100644
index 15af079..0000000
--- a/node_server/views/layout.jade
+++ /dev/null
@@ -1,7 +0,0 @@
-doctype html
-html
-  head
-    title= title
-    link(rel='stylesheet', href='/stylesheets/style.css')
-  body
-    block content
diff --git a/vue_app/package.json b/package.json
similarity index 98%
rename from vue_app/package.json
rename to package.json
index c161ece..38e56c5 100644
--- a/vue_app/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "aws-sdk": "^2.307.0",
-    "axios": "^0.18.0",
+    "axios": "^0.21.1",
     "epic-spinners": "^1.0.3",
     "file-saver": "^2.0.2",
     "filesize": "^3.6.1",
diff --git a/vue_app/public/favicon.ico b/public/favicon.ico
similarity index 100%
rename from vue_app/public/favicon.ico
rename to public/favicon.ico
diff --git a/vue_app/public/img/icons/android-chrome-192x192.png b/public/img/icons/android-chrome-192x192.png
similarity index 100%
rename from vue_app/public/img/icons/android-chrome-192x192.png
rename to public/img/icons/android-chrome-192x192.png
diff --git a/vue_app/public/img/icons/android-chrome-512x512.png b/public/img/icons/android-chrome-512x512.png
similarity index 100%
rename from vue_app/public/img/icons/android-chrome-512x512.png
rename to public/img/icons/android-chrome-512x512.png
diff --git a/vue_app/public/img/icons/apple-touch-icon-120x120.png b/public/img/icons/apple-touch-icon-120x120.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon-120x120.png
rename to public/img/icons/apple-touch-icon-120x120.png
diff --git a/vue_app/public/img/icons/apple-touch-icon-152x152.png b/public/img/icons/apple-touch-icon-152x152.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon-152x152.png
rename to public/img/icons/apple-touch-icon-152x152.png
diff --git a/vue_app/public/img/icons/apple-touch-icon-180x180.png b/public/img/icons/apple-touch-icon-180x180.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon-180x180.png
rename to public/img/icons/apple-touch-icon-180x180.png
diff --git a/vue_app/public/img/icons/apple-touch-icon-60x60.png b/public/img/icons/apple-touch-icon-60x60.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon-60x60.png
rename to public/img/icons/apple-touch-icon-60x60.png
diff --git a/vue_app/public/img/icons/apple-touch-icon-76x76.png b/public/img/icons/apple-touch-icon-76x76.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon-76x76.png
rename to public/img/icons/apple-touch-icon-76x76.png
diff --git a/vue_app/public/img/icons/apple-touch-icon.png b/public/img/icons/apple-touch-icon.png
similarity index 100%
rename from vue_app/public/img/icons/apple-touch-icon.png
rename to public/img/icons/apple-touch-icon.png
diff --git a/vue_app/public/img/icons/favicon-16x16.png b/public/img/icons/favicon-16x16.png
similarity index 100%
rename from vue_app/public/img/icons/favicon-16x16.png
rename to public/img/icons/favicon-16x16.png
diff --git a/vue_app/public/img/icons/favicon-16x162.png b/public/img/icons/favicon-16x162.png
similarity index 100%
rename from vue_app/public/img/icons/favicon-16x162.png
rename to public/img/icons/favicon-16x162.png
diff --git a/vue_app/public/img/icons/favicon-32x32.png b/public/img/icons/favicon-32x32.png
similarity index 100%
rename from vue_app/public/img/icons/favicon-32x32.png
rename to public/img/icons/favicon-32x32.png
diff --git a/vue_app/public/img/icons/msapplication-icon-144x144.png b/public/img/icons/msapplication-icon-144x144.png
similarity index 100%
rename from vue_app/public/img/icons/msapplication-icon-144x144.png
rename to public/img/icons/msapplication-icon-144x144.png
diff --git a/vue_app/public/img/icons/mstile-150x150.png b/public/img/icons/mstile-150x150.png
similarity index 100%
rename from vue_app/public/img/icons/mstile-150x150.png
rename to public/img/icons/mstile-150x150.png
diff --git a/vue_app/public/img/icons/safari-pinned-tab.svg b/public/img/icons/safari-pinned-tab.svg
similarity index 100%
rename from vue_app/public/img/icons/safari-pinned-tab.svg
rename to public/img/icons/safari-pinned-tab.svg
diff --git a/vue_app/public/index.html b/public/index.html
similarity index 100%
rename from vue_app/public/index.html
rename to public/index.html
diff --git a/vue_app/public/manifest.json b/public/manifest.json
similarity index 100%
rename from vue_app/public/manifest.json
rename to public/manifest.json
diff --git a/vue_app/public/robots.txt b/public/robots.txt
similarity index 100%
rename from vue_app/public/robots.txt
rename to public/robots.txt
diff --git a/vue_app/public/vendors/jsonviewer/jquery.json-viewer.css b/public/vendors/jsonviewer/jquery.json-viewer.css
similarity index 100%
rename from vue_app/public/vendors/jsonviewer/jquery.json-viewer.css
rename to public/vendors/jsonviewer/jquery.json-viewer.css
diff --git a/vue_app/public/vendors/jsonviewer/jquery.json-viewer.js b/public/vendors/jsonviewer/jquery.json-viewer.js
similarity index 100%
rename from vue_app/public/vendors/jsonviewer/jquery.json-viewer.js
rename to public/vendors/jsonviewer/jquery.json-viewer.js
diff --git a/vue_app/src/App.vue b/src/App.vue
similarity index 100%
rename from vue_app/src/App.vue
rename to src/App.vue
diff --git a/vue_app/src/api/menu.js b/src/api/menu.js
similarity index 100%
rename from vue_app/src/api/menu.js
rename to src/api/menu.js
diff --git a/vue_app/src/api/notification.js b/src/api/notification.js
similarity index 100%
rename from vue_app/src/api/notification.js
rename to src/api/notification.js
diff --git a/vue_app/src/assets/Minio_Logo_Black.png b/src/assets/Minio_Logo_Black.png
similarity index 100%
rename from vue_app/src/assets/Minio_Logo_Black.png
rename to src/assets/Minio_Logo_Black.png
diff --git a/vue_app/src/assets/logo.png b/src/assets/logo.png
similarity index 100%
rename from vue_app/src/assets/logo.png
rename to src/assets/logo.png
diff --git a/vue_app/src/assets/logo2.png b/src/assets/logo2.png
similarity index 100%
rename from vue_app/src/assets/logo2.png
rename to src/assets/logo2.png
diff --git a/vue_app/src/components/AppDrawer.vue b/src/components/AppDrawer.vue
similarity index 99%
rename from vue_app/src/components/AppDrawer.vue
rename to src/components/AppDrawer.vue
index 7ac5452..d28feb5 100644
--- a/vue_app/src/components/AppDrawer.vue
+++ b/src/components/AppDrawer.vue
@@ -184,8 +184,9 @@ export default {
 			}			
 			if (this.drawer2 == true){
 				this.expand_sto = "expand_less"	
+				window.getApp.$emit('REFRESH_BUCKETS_LIST')		
 			}else if (this.drawer2 == false){
-				this.expand_sto = "expand_more"				
+				this.expand_sto = "expand_more"		
 			}
 		}			
 		},
diff --git a/vue_app/src/components/AppToolbar.vue b/src/components/AppToolbar.vue
similarity index 100%
rename from vue_app/src/components/AppToolbar.vue
rename to src/components/AppToolbar.vue
diff --git a/src/components/forms/FunctionForm.vue b/src/components/forms/FunctionForm.vue
new file mode 100644
index 0000000..6c6382e
--- /dev/null
+++ b/src/components/forms/FunctionForm.vue
@@ -0,0 +1,2119 @@
+<template>
+	<v-layout row wrap justify-end>    
+		<v-btn flat icon color="blue" @click="handleUpdate()">
+      		<v-icon>autorenew</v-icon>
+    	</v-btn>
+		<v-dialog id="vdiag" lazy v-model="dialog" persistent :fullscreen="$vuetify.breakpoint.xs" max-width="50%">
+			<v-btn slot="activator" color="teal" dark class="mb-2">
+				<v-icon left>add_box</v-icon>
+				Deploy New Service
+			</v-btn>
+			<v-card >
+				<v-toolbar flat :color="formColor" class="white--text" style="margin-bottom:10px;">
+					<span class="headline" style="width:100%;text-align:center">{{ formTitle }}</span>
+				</v-toolbar>
+					<v-form  ref="form" v-model="form.valid" lazy-validation>
+						<div>
+						
+						<ul class="nav nav-pills nav-fill" id="myTab" role="tablist" style="padding-right:5px; padding-left:5px;">
+							<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
+								<a class="nav-link active" id="home-tab" @click="show('home')" role="tab" aria-controls="home" aria-selected="true">New Service</a>
+							</li>
+							<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
+								<a class="nav-link" id="profile-tab" @click="show('profile')" role="tab" aria-controls="profile" aria-selected="false">Storage</a>
+							</li>  
+							<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
+								<a class="nav-link " id="input_output-tab" @click="show('input_output')" role="tab" aria-controls="input_output" aria-selected="false">Input/Output</a>
+							</li>
+						</ul>
+						
+						<v-progress-linear :active="progress.active" :indeterminate="true"></v-progress-linear>
+						
+						<div class="tab-content" id="myTabContent">
+							<div class="tab-pane tab-pane-content fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
+								<v-card-text>
+										<v-layout wrap>
+											<div style="width:100%;padding: 0px 10px;">
+												<v-flex xs12>
+													<v-text-field
+														v-model="form.image"
+														:rules="form.imageRules"
+														:counter="200"
+														label="Docker image:"
+														required
+													></v-text-field>
+												</v-flex>
+
+												<v-flex xs12>
+													<v-text-field
+														v-model="form.name"
+														:rules="form.nameRules"
+														:counter="200"
+														label="Function name"
+														required
+														:disabled="this.editionMode"
+													></v-text-field>
+												</v-flex>               
+											</div>
+											<div class="row" style="width:100%;padding: 0px 10px;"> 	
+												<v-flex xs12  md5 text-xs-center>
+													<v-btn color="primary" class="white--text" @click.native="addFiles()"> Select a file<v-icon right dark>note_add</v-icon></v-btn>
+												</v-flex>
+
+												<v-flex xs12  md2 class="text-xs-center">
+													<v-chip>or</v-chip>
+												</v-flex>
+
+												<v-flex xs12  md5>
+													<div style="margin:10px" class="form-group">                     
+													<div class="input-group">
+														<input type="text" class="form-control" id="bucketname" autocomplete="off" v-model="url"   placeholder="URL" autofocus  style="border-right: none; border-left:none; border-top:none; hover: "/>                     
+														
+														<div class="input-group-append mr-2">                        
+														<button class="" @click="readurl()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+														<button class="" @click="cleanfield()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+														</div>
+													</div>            
+													</div> 
+												</v-flex>
+
+												<v-flex xs12 text-xs-center>
+													<span v-show="filerequire" style="color: #cc3300; font-size: 12px;"><b>Select a file or enter a URL</b></span>                   									
+												</v-flex>
+
+												
+												<v-flex xs12 sm8 offset-sm2 v-show="showSelectedFiles"  id="selectedList" class="text-xs-center">
+														<input type="file" id="files" ref="files" hidden=true  v-on:change="handleFilesUpload()"/>								                  									
+														<v-list subheader dense >
+															<v-subheader inset>File</v-subheader>
+															<v-list-tile
+															v-for="(file, key) in files"
+															:key="key"
+															avatar
+															@click.stop=""
+															>                                    
+																	<v-progress-circular
+																	indeterminate
+																	color="teal"
+																	v-show="showUploading"
+																	>
+																	</v-progress-circular>
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{ filename }}</v-list-tile-title>														
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeFile(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+														<v-card flat>
+															<v-card-actions >
+															<v-btn
+																outline color="indigo"
+																round
+																small
+																@click.native="editSummernote()"
+															>
+																Edit															
+															</v-btn>
+															<v-btn
+																outline color="indigo"
+																round
+																small
+																@click.native="saveSummernote()"
+															>
+																Save															
+															</v-btn>
+															</v-card-actions>
+															<v-card-actions>
+															
+															</v-card-actions>
+														</v-card>
+												</v-flex>	
+												<v-flex xs-12 text-center v-show="editionMode==true && showSelectedFiles == false">
+													<span>Note: To edit the script sending in the creation of the service press the Edit button.</span>
+													<v-card flat>
+															<v-card-actions style="justify-content: center;">
+															<v-btn
+																outline color="indigo"
+																round
+																small
+																@click.native="editSummernote()"
+															>
+																Edit															
+															</v-btn>
+															<v-btn
+																outline color="indigo"
+																round
+																small
+																@click.native="saveSummernote()"
+															>
+																Save															
+															</v-btn>
+															</v-card-actions>
+														</v-card>
+												</v-flex>
+												<v-flex xs12>
+													<!-- <div  v-show="editScript==true" style="white-space: pre-wrap;" class="click2edit text-left"></div>				 -->
+													<div class="summernote" style="white-space: pre-wrap;"></div>
+													<!-- <div v-show="editScript==true" style="white-space: pre-wrap;" class="click2edit text-left"></div>				 -->
+												</v-flex>
+										
+												<v-flex xs12>
+														<v-btn
+														outline color="indigo"
+														round
+														small
+														@click.native="collapse()"
+													>
+														More Options
+														<v-icon right dark>{{expand}}</v-icon>
+													</v-btn>                    
+												</v-flex>
+											</div>
+										
+											<v-flex xs12 id="panel">  								
+												<v-container>
+													<v-layout row wrap>
+														<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex xs12 sm5>
+																<v-text-field
+																	v-model="form.envVarskey"
+																	:counter="200"
+																	label="Environment variables (key)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															<v-flex xs10 sm5>
+																<v-text-field
+																	v-model="form.envVarsValue"
+																	:counter="200"
+																	label="Environment variables (value)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															
+															<v-flex xs2 sm2 style="padding-top:20px;" >
+																<div  class="input-group-append mr-2">  														                    
+																	<button class="" @click="includeEnv()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																	<button class="" @click="cleanfieldenv()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+																</div>
+															</v-flex>
+														</div>            
+														</div> 
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showselectEnv">
+														<input type="file" id="envs" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>Env Vars</v-subheader>
+															<v-list-tile
+															v-for="(enVar,key) in envVars"
+															:key="key"
+															avatar
+															@click.stop=""
+															>       
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{key}}:{{envVars[key]}}</v-list-tile-title>
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeEnv(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+
+													<v-layout row wrap>
+														<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex xs12 sm5>
+																<v-text-field
+																	v-model="form.annotkey"
+																	:counter="200"
+																	label="Annotation (key)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															<v-flex xs10 sm5>
+																<v-text-field
+																	v-model="form.annotvalue"
+																	:counter="200"
+																	label="Annotation (value)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															
+															<v-flex xs2 sm2 style="padding-top:20px;" >
+																<div  class="input-group-append mr-2">  														                    
+																	<button class="" @click="includeAnnot()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																	<button class="" @click="cleanfieldAnn()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+																</div>
+															</v-flex>
+														</div>            
+														</div> 
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showselectAnn">
+														<input type="file" id="envs" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>Annotations</v-subheader>
+															<v-list-tile
+															v-for="(enVar,key) in annotations"
+															:key="key"
+															avatar
+															@click.stop=""
+															>       
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{key}}:{{annotations[key]}}</v-list-tile-title>
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeAnn(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+
+													<v-layout row wrap>
+														<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex xs12 sm5>
+																<v-text-field
+																	v-model="form.labelskey"
+																	:counter="200"
+																	label="Label (key)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															<v-flex xs10 sm5>
+																<v-text-field
+																	v-model="form.labelsvalue"
+																	:counter="200"
+																	label="Label (value)"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															
+															<v-flex xs2 sm2 style="padding-top:20px;" >
+																<div  class="input-group-append mr-2">  														                    
+																	<button class="" @click="includeLabels()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																	<button class="" @click="cleanfieldLabels()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+																</div>
+															</v-flex>
+														</div>            
+														</div> 
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showselectLabel">
+														<input type="file" id="envs" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>Labels</v-subheader>
+															<v-list-tile
+															v-for="(enVar,key) in labels"
+															:key="key"
+															avatar
+															@click.stop=""
+															>       
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{key}}:{{labels[key]}}</v-list-tile-title>
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeLabels(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+													
+													<v-layout row wrap>
+														<v-flex xs12 sm5>
+															<v-text-field
+																v-model="form.limits_cpu"
+																:counter="10"
+																label="CPU"
+																style="padding-right: 5px;"											
+															></v-text-field>											
+														</v-flex>
+
+														<v-flex xs10 sm5>
+															<v-text-field
+																v-model="form.limits_memory"
+																:counter="10"
+																label="Memory"
+																style="padding-right: 5px;"																											
+															></v-text-field>																						
+														</v-flex>  
+														<v-flex xs2 sm2 style="padding-top:10px;">
+															<select id="classmemory" class="custom-select" >																										
+																<option selected value="1">Mi</option>
+																<option value="2">Gi</option>															
+															</select>
+														</v-flex>	
+
+														<v-flex xs12 sm3 style="padding-top:10px;">
+															<v-select
+																:items="form.log_level"
+																label="LOG LEVEL"
+																v-model="select_logLevel"
+															></v-select>
+														</v-flex>	
+														
+													</v-layout>
+												</v-container>								
+											</v-flex> 						
+										</v-layout>
+								</v-card-text>
+								<v-card-actions style="background-color:white;">
+									<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
+									<v-btn @click="clearHome()" flat color="red">Clear</v-btn>
+									<v-spacer></v-spacer>
+									<v-btn @click="show('profile')" flat color="success">NEXT</v-btn>
+								</v-card-actions>
+							</div>
+
+							<div class="tab-pane tab-pane-content fade" id="input_output" role="tabpanel" aria-labelledby="input_output-tab" style="padding-right:3rem; padding-left:3rem;">
+								
+								<ul class="nav nav-pills nav-fill" id="myTabInOut" role="tablist" style="padding-right:5px; padding-left:5px;">
+									<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
+										<a class="nav-link active" id="input-tab" @click="show_input('input')" role="tab" aria-controls="home" aria-selected="true">INPUTS</a>
+									</li>
+									<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
+										<a class="nav-link" id="output-tab" @click="show_input('output')" role="tab" aria-controls="input_output" aria-selected="false">OUTPUTS</a>
+									</li>
+								</ul>
+
+								<div class="tab-content" id="myTabContentInOut">
+									<div class="tab-pane tab-pane-inout fade show active"  id="input" role="tabpanel" aria-labelledby="input-tab" style="padding-right:3rem; padding-left:3rem;">
+											<v-layout row wrap>
+												<v-flex xs12>  								
+													<v-container>
+														<v-flex xs12 text-xs-center>
+															<span v-show="showErrorInput" style="color: #cc3300; font-size: 12px;"><b>The Storage Provider and Path fields are required.</b></span>                   									
+														</v-flex>
+														<div class="form-group" style="width:100%">                     
+															<div class="input-group">
+																<v-flex class="col-12">
+																	<v-select
+																		v-model="form.storage_provider_in"
+																		:items="storages_all"
+																		label="Storage Provider"
+																		outline
+																	></v-select>																
+																</v-flex>
+																<v-flex>
+																	<v-text-field
+																		v-model="form.path_in"
+																		:counter="200"
+																		label="Path"		
+																		style="padding-right: 5px;"									
+																	></v-text-field>
+																</v-flex>															
+															</div>            
+														</div> 
+
+														<div class="form-group" style="width:100%">                     
+															<div class="input-group">
+																<v-flex>
+																	<v-text-field
+																		v-model="form.prefix_in"
+																		:counter="200"
+																		label="Prefix"		
+																		style="padding-right: 5px;"									
+																	></v-text-field>
+																</v-flex>	
+
+																<div  class="input-group-append mr-2">  														                    
+																	<button class="" @click="includePrefixIn()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																	<button class="" @click="cleanfieldPrefixIn()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+																</div>
+															</div>            
+														</div> 
+
+														<v-flex xs12 sm6 offset-sm3 v-show="showselectPrefixIn">
+															<input type="file" id="prefixs" hidden="true" multiple />
+															<v-list subheader dense>
+																<v-subheader inset>Prefixs</v-subheader>
+																<v-list-tile
+																v-for="(prefix,key) in prefixs_in"
+																:key="key"
+																avatar
+																@click.stop=""
+																>                                    
+																		
+
+																		<v-list-tile-content>
+																			<v-list-tile-title>{{prefix}}</v-list-tile-title>
+																		</v-list-tile-content>
+
+																		<v-list-tile-action>
+																			<v-btn icon ripple @click="removePrefixIn(key)">
+																			<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																			</v-btn>
+																		</v-list-tile-action>
+																</v-list-tile>
+															</v-list>
+														</v-flex>
+
+
+
+														<div class="form-group" style="width:100%">                     
+															<div class="input-group">
+																<v-flex>
+																	<v-text-field
+																		v-model="form.suffix_in"
+																		:counter="200"
+																		label="Suffix"		
+																		style="padding-right: 5px;"									
+																	></v-text-field>
+																</v-flex>	
+																<div  class="input-group-append mr-2">  														                    
+																	<button class="" @click="includeSuffixIn()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																	<button class="" @click="cleanfieldSuffixIn()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+																</div>
+															</div>            
+														</div> 
+
+														<v-flex xs12 sm6 offset-sm3 v-show="showselectSuffixIn">
+															<input type="file" id="suffix" hidden="true" multiple />
+															<v-list subheader dense>
+																<v-subheader inset>Suffixs</v-subheader>
+																<v-list-tile
+																v-for="(suffix,key) in suffixs_in"
+																:key="key"
+																avatar
+																@click.stop=""
+																>                                    
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{suffix}}</v-list-tile-title>
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeSuffixIn(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+																</v-list-tile>
+															</v-list>
+														</v-flex>
+													</v-container>
+												</v-flex>	
+											</v-layout>
+
+											<v-flex xs12 v-show="showselectInput">
+												<input type="file" id="inputs" hidden="true" multiple />
+												<v-list subheader dense three-line>
+													<v-subheader inset>Inputs</v-subheader>
+													<v-list-tile
+													v-for="(input,key) in inputs"
+													:key="key"
+													avatar
+													@click.stop=""
+													style="margin-bottom:10px;"
+													>                                    
+															<v-list-tile-content>
+																<v-list-tile-title style="padding-bottom:20px;">Path: {{input.path}}</v-list-tile-title>
+																<v-list-tile-title style="padding-bottom:20px;">Storage_provider: {{input.storage_provider}}</v-list-tile-title>
+																<v-list-tile-title style="padding-bottom:20px;">Prefix: {{input.prefix}}</v-list-tile-title>
+																<v-list-tile-title style="padding-bottom:25px;">Suffix: {{input.suffix}}</v-list-tile-title> 
+															</v-list-tile-content>
+
+															<v-list-tile-action>
+																<v-btn icon ripple @click="removeInput(key)">
+																<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																</v-btn>
+															</v-list-tile-action>
+													</v-list-tile>
+												</v-list>
+											</v-flex>
+
+											<v-card-actions class="text-md-center" >
+												<v-spacer></v-spacer>
+												<v-btn @click="includeInput()"  color="info">ADD INPUT</v-btn>
+												
+											</v-card-actions>
+									</div>
+
+									<div class="tab-pane tab-pane-inout fade"  id="output" role="tabpanel" aria-labelledby="output-tab" style="padding-right:3rem; padding-left:3rem;">
+										<v-layout row wrap>
+											<v-flex xs12>  								
+												<v-container>
+													<v-flex xs12 text-xs-center>
+														<span v-show="showErrorOutput" style="color: #cc3300; font-size: 12px;"><b>The Storage Provider and Path fields are required.</b></span>                   									
+													</v-flex>
+													<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex class="col-12">
+																<v-select
+																	v-model="form.storage_provider_out"
+																	:items="storages_all"
+																	label="Storage Provider"
+																	outline
+																></v-select>																
+															</v-flex>
+															<v-flex>
+																<v-text-field
+																	v-model="form.path_out"
+																	:counter="200"
+																	label="Path"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															
+														</div>            
+													</div> 
+
+													<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex>
+																<v-text-field
+																	v-model="form.prefix_out"
+																	:counter="200"
+																	label="Prefix"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+
+															<div  class="input-group-append mr-2">  														                    
+																<button class="" @click="includePrefixOut()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																<button class="" @click="cleanfieldPrefixOut()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+															</div>
+														</div>            
+													</div> 
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showselectPrefixOut">
+														<input type="file" id="prefixs" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>Prefixs</v-subheader>
+															<v-list-tile
+															v-for="(prefix,key) in prefixs_out"
+															:key="key"
+															avatar
+															@click.stop=""
+															>                                    
+																	
+
+																	<v-list-tile-content>
+																		<v-list-tile-title>{{prefix}}</v-list-tile-title>
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removePrefixOut(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+
+
+
+													<div class="form-group" style="width:100%">                     
+														<div class="input-group">
+															<v-flex>
+																<v-text-field
+																	v-model="form.suffix_out"
+																	:counter="200"
+																	label="Suffix"		
+																	style="padding-right: 5px;"									
+																></v-text-field>
+															</v-flex>	
+															<div  class="input-group-append mr-2">  														                    
+																<button class="" @click="includeSuffixOut()" type="button"><v-icon left color="green">check_circle</v-icon></button>
+																<button class="" @click="cleanfieldSuffixOut()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
+															</div>
+														</div>            
+													</div> 
+
+
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showselectSuffixOut">
+														<input type="file" id="suffix" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>Suffixs</v-subheader>
+															<v-list-tile
+															v-for="(suffix,key) in suffixs_out"
+															:key="key"
+															avatar
+															@click.stop=""
+															>                                    
+
+																<v-list-tile-content>
+																	<v-list-tile-title>{{suffix}}</v-list-tile-title>
+																</v-list-tile-content>
+
+																<v-list-tile-action>
+																	<v-btn icon ripple @click="removeSuffixOut(key)">
+																	<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																	</v-btn>
+																</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+												</v-container>
+											</v-flex>	
+										</v-layout>
+
+										<v-flex xs12 v-show="showselectOutput">
+											<input type="file" id="inputs" hidden="true" multiple />
+											<v-list subheader dense three-line>
+												<v-subheader inset>Outputs</v-subheader>
+												<v-list-tile
+												v-for="(output,key) in outputs"
+												:key="key"
+												avatar
+												@click.stop=""
+												style="margin-bottom:10px;"
+												>                                    
+														<v-list-tile-content>
+															<v-list-tile-title style="padding-bottom:20px;">Path: {{output.path}}</v-list-tile-title>
+															<v-list-tile-title style="padding-bottom:20px;">Storage_provider: {{output.storage_provider}}</v-list-tile-title>
+															<v-list-tile-title style="padding-bottom:20px;">Prefix: {{output.prefix}}</v-list-tile-title>
+															<v-list-tile-title style="padding-bottom:25px;">Suffix: {{output.suffix}}</v-list-tile-title> 
+														</v-list-tile-content>
+
+														<v-list-tile-action>
+															<v-btn icon ripple @click="removeOutput(key)">
+															<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+															</v-btn>
+														</v-list-tile-action>
+												</v-list-tile>
+											</v-list>
+										</v-flex>
+
+										<v-card-actions class="text-md-center" >
+											<v-spacer></v-spacer>
+											<v-btn @click="includeOutput()"  color="info">ADD OUTPUT</v-btn>
+										</v-card-actions>
+									</div>
+									<v-card-actions style="background-color:white;" >
+										<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
+										<v-btn @click="cleanfieldInput();cleanfieldOutput()" flat color="red">Clear</v-btn>
+										<v-spacer></v-spacer>
+										<v-btn @click="show('profile')" flat color="blue">BACK</v-btn>
+										<v-btn :disabled="!form.valid || disabled_submit==true" @click="submit" flat color="success">Submit</v-btn>
+										<!-- <v-btn @click="show('input_output')" flat color="success">NEXT</v-btn> -->
+										
+									</v-card-actions>
+								</div>		
+										
+							</div>
+
+							<div class="tab-pane tab-pane-content fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
+
+								<div class=" div-list-content" >
+									<v-card style="padding:0 2rem 2rem 2rem;">
+
+										<v-tabs
+											fixed-tabs
+											v-model="model_create"
+											centered
+										>
+											<v-tab
+											:href="`#tab-minio`"
+											>
+												MINIO
+											</v-tab>
+											<v-tab
+											:href="`#tab-onedata`"
+											>
+												ONE DATA
+											</v-tab>
+											<v-tab
+											:href="`#tab-s3`"
+											>
+												S3
+											</v-tab>
+										</v-tabs>
+
+										<v-tabs-items v-model="model_create" >
+											<v-tab-item  :value="`tab-onedata`">
+												<v-container>
+													
+										
+													<v-layout row style="padding:0px,10px;justify-content: center;">										
+														<img src="../../img/logo_one_data.jpg" alt=""> 
+													</v-layout>
+													<br>
+													<v-flex xs12 text-xs-center>
+														<span v-show="showErrorOneData" style="color: #cc3300; font-size: 12px;"><b>To add a storage option you must complete all the information.</b></span>                   									
+													</v-flex>
+													<br>
+
+													<v-layout row style="padding:0px,10px;" >										
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field
+																v-model="onedata.id"
+																:counter="200"		
+																label="ID"																
+															></v-text-field>
+														</v-flex>									
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;" >										
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field
+																v-model="onedata.oneprovider_host"
+																:counter="200"		
+																label="ONEPROVIDER HOST:"																
+															></v-text-field>
+														</v-flex>									
+													</v-layout>
+
+													<v-flex xs12 text-xs-center>
+														<span v-show="envrequirehost" style="color: #cc3300; font-size: 12px;"><b>ONEPROVIDER HOST is required</b></span>                   									
+													</v-flex>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="onedata.token"
+																:append-icon="showOneDataToken ? 'visibility_off' : 'visibility'"
+																:type="showOneDataToken ? 'text' : 'password'"
+																:counter="200"
+																label="ACCESS TOKEN:"
+																@click:append="showOneDataToken = !showOneDataToken"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-flex xs12 text-xs-center>
+														<span v-show="envrequiretoken" style="color: #cc3300; font-size: 12px;"><b>ACCESS TOKEN is required</b></span>                   									
+													</v-flex>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="onedata.space"
+																:counter="200"
+																label="SPACE:"
+															></v-text-field>
+														</v-flex>										
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showOneData">
+														<input type="file" id="onedata" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>ONEDATA</v-subheader>
+															<v-list-tile
+															v-for="(id,key) in ONEDATA_DICT"
+															:key="key"
+															avatar
+															@click.stop=""
+															style="margin-bottom:40px;"
+															>                                    
+																	
+
+																	<v-list-tile-content style="height:80px;">
+																		<v-list-tile-title style="padding-bottom:20px;">ID: {{key}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">ONEPROVIDER HOST: {{id.oneprovider_host}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">ACCES TOKEN: <span class="hide_text">*********</span> </v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">SPACE: {{id.space}}</v-list-tile-title>
+																		<!-- <v-list-tile-title>{{key}}</v-list-tile-title> -->
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeOneData(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																</v-list-tile-action>
+														</v-list-tile>
+													</v-list>
+												</v-flex>
+
+												<v-card-actions class="text-md-center" >
+													<v-spacer></v-spacer>
+													<v-btn @click="includeOneData()"  color="info">ADD</v-btn>
+													
+												</v-card-actions>
+
+
+											</v-container>	
+											</v-tab-item>
+
+											<v-tab-item  :value="`tab-minio`">
+												<v-container>
+													
+										
+													<v-layout row style="padding:0px,10px;justify-content: center;">										
+														<img src="../../img/minio-storage.png" height="110px" alt=""> 
+													</v-layout>
+													<br>
+													<v-flex xs12 text-xs-center>
+														<span v-show="showErrorMinio" style="color: #cc3300; font-size: 12px;"><b>To add a storage option you must complete all the information.</b></span>                   									
+													</v-flex>
+													<br>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="minio.id"
+																:counter="200"
+																label="ID"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="minio.endpoint"
+																:counter="200"
+																label="ENDPOINT"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+														<v-text-field 
+															v-model="minio.region"
+															:counter="200"
+															label="REGION"
+														></v-text-field>
+													</v-flex>										
+												</v-layout>
+												<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="minio.secret_key"
+																:append-icon="showMinioSecretKey ? 'visibility_off' : 'visibility'"
+																:type="showMinioSecretKey ? 'text' : 'password'"
+																:counter="200"
+																label="SECRET KEY"
+																@click:append="showMinioSecretKey = !showMinioSecretKey"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="minio.access_key"
+																:append-icon="showMinioAccessKey ? 'visibility_off' : 'visibility'"
+																:type="showMinioAccessKey ? 'text' : 'password'"
+																:counter="200"
+																label="ACCESS KEY"
+																@click:append="showMinioAccessKey = !showMinioAccessKey"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex row xs12 sm8 offset-sm2>
+																<span style="margin-top:16px;padding-top:4px;color:#605C5C;padding-right:10px;">VERIFY</span>
+																<v-switch
+																	v-model="minio.verify"
+																></v-switch>
+														</v-flex>										
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showMinio">
+														<input type="file" id="minio" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>MINIO</v-subheader>
+															<v-list-tile
+															v-for="(id,key) in MINIO_DICT"
+															:key="key"
+															avatar
+															@click.stop=""
+															style="margin-bottom:80px;"
+															>                                    
+																	
+
+																	<v-list-tile-content style="height:120px;margin-top:40px;">
+																		<v-list-tile-title style="padding-bottom:20px;">ID: {{key}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">ENDPOINT: {{id.endpoint}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">REGION: {{id.region}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">SECRET KEY: <span class="hide_text">*********</span></v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">ACCESS KEY: <span class="hide_text">*********</span></v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">VERIFY: {{id.verify}}</v-list-tile-title>
+																		<!-- <v-list-tile-title>{{key}}</v-list-tile-title> -->
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeMinio(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+
+													<v-card-actions class="text-md-center" >
+														<v-spacer></v-spacer>
+														<v-btn @click="includeMinio()"  color="info">ADD</v-btn>
+														
+													</v-card-actions>
+
+												</v-container>
+											</v-tab-item>
+
+											<v-tab-item  :value="`tab-s3`">
+												<v-container>
+													
+										
+													<v-layout row style="padding:0px,10px;justify-content: center;">										
+														<img src="../../img/amazon-s3.png" height="110px" alt=""> 
+													</v-layout>
+													<br>
+													<v-flex xs12 text-xs-center>
+														<span v-show="showErrorS3" style="color: #cc3300; font-size: 12px;"><b>To add a storage option you must complete all the information.</b></span>                   									
+													</v-flex>
+													<br>
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="s3.id"
+																:counter="200"
+																label="ID"
+															></v-text-field>
+														</v-flex>										
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="s3.access_key"
+																:append-icon="showS3AccessKey ? 'visibility_off' : 'visibility'"
+																:type="showS3AccessKey ? 'text' : 'password'"
+																:counter="200"
+																label="ACCESS KEY"
+																@click:append="showS3AccessKey = !showS3AccessKey"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="s3.secret_key"
+																:append-icon="showS3SecretKey ? 'visibility_off' : 'visibility'"
+																:type="showS3SecretKey ? 'text' : 'password'"
+																:counter="200"
+																label="SECRET KEY"
+																@click:append="showS3SecretKey = !showS3SecretKey"
+															></v-text-field>
+														</v-flex>
+													</v-layout>
+
+													<v-flex xs12 text-xs-center>
+														<span v-show="envrequiretoken" style="color: #cc3300; font-size: 12px;"><b>ACCESS TOKEN is required</b></span>                   									
+													</v-flex>
+
+													<v-layout row style="padding:0px,10px;">
+														<v-flex xs12 sm8 offset-sm2>
+															<v-text-field 
+																v-model="s3.region"
+																:counter="200"
+																label="REGION"
+															></v-text-field>
+														</v-flex>										
+													</v-layout>
+
+													<v-flex xs12 sm6 offset-sm3 v-show="showS3">
+														<input type="file" id="s3" hidden="true" multiple />
+														<v-list subheader dense>
+															<v-subheader inset>S3</v-subheader>
+															<v-list-tile
+															v-for="(id,key) in S3_DICT"
+															:key="key"
+															avatar
+															@click.stop=""
+															style="margin-bottom:40px;"
+															>                                    
+																	
+
+																	<v-list-tile-content style="height:80px;">
+																		<v-list-tile-title style="padding-bottom:20px;">ID: {{key}}</v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">ACCESS KEY: <span class="hide_text">*********</span></v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">SECRET TOKEN: <span class="hide_text">*********</span></v-list-tile-title>
+																		<v-list-tile-title style="padding-bottom:20px;">REGION: {{id.region}}</v-list-tile-title>
+																		<!-- <v-list-tile-title>{{key}}</v-list-tile-title> -->
+																	</v-list-tile-content>
+
+																	<v-list-tile-action>
+																		<v-btn icon ripple @click="removeS3(key)">
+																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
+																		</v-btn>
+																	</v-list-tile-action>
+															</v-list-tile>
+														</v-list>
+													</v-flex>
+
+													<v-card-actions class="text-md-center" >
+														<v-spacer></v-spacer>
+														<v-btn @click="includeS3()"  color="info">ADD</v-btn>
+														
+													</v-card-actions>
+
+
+												</v-container>
+											</v-tab-item>
+										</v-tabs-items>	
+									</v-card>
+								</div>
+								<v-card-actions style="background-color:white;">
+									<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
+									<v-btn @click="cleanfieldMinio();cleanfieldOneData();cleanfieldS3()" flat color="red">Clear</v-btn>
+									<v-spacer></v-spacer>
+									<v-btn  @click="show('home')" flat color="primary">BACK</v-btn>								
+									<v-btn @click="show('input_output')" flat color="success">NEXT</v-btn>
+									
+								</v-card-actions>						
+							</div>  
+						</div>									
+					</div>	
+				</v-form>			
+			</v-card>			
+		</v-dialog>    
+	</v-layout>
+</template>
+
+<script>
+import axios from 'axios'
+import Services from '../../components/services';
+/* eslint-disable */
+export default {   
+	mixins:[Services],
+	name: 'FunctionForm',
+	data () {
+		return {			
+			dialog: false,        
+			drawer: false,    
+			url: "", 
+			allText: "", 
+			expand: "expand_more",
+			editionMode: false,
+			base64String : "",    
+			filename: "",  
+			files: [],    
+			inputs:[],  
+			prefixs_in:[],  
+			suffixs_in:[],  
+			outputs:[],  
+			prefixs_out:[],  
+			suffixs_out:[],  
+			showUploading: false,
+			showselectEnv: false,
+			showselectAnn: false,
+			showselectLabel: false,
+			showselectInput: false,
+			showselectPrefixIn: false,
+			showselectSuffixIn: false,
+			showselectOutput: false,
+			showselectPrefixOut: false,
+			showselectSuffixOut: false,		
+			showOneDataToken: false,
+			showS3AccessKey: false,
+			showS3SecretKey: false,
+			showMinioAccessKey: false,
+			showMinioSecretKey: false,
+			showOneData: false,
+			showMinio: false,
+			showS3: false,
+			showErrorMinio:false,
+			showErrorOneData:false,
+			showErrorS3:false,
+			showErrorInput:false,
+			showErrorOutput:false,
+			filerequire : false,
+			envrequirehost: false,
+			envrequiretoken : false,
+			envrequirespace : false,
+			envVars:{},
+			annotations:{},
+			labels:{},
+			envVarsAll:{},
+			limits_mem: '',
+			request_mem: '',
+			select_logLevel: '',
+			ONEDATA_DICT:{},
+			S3_DICT:{},
+			MINIO_DICT:{},
+			 minio:{
+				id:'',
+				endpoint: '' ,
+				region: '',
+				secret_key: '',
+				access_key: '',
+				verify: true
+			},
+			s3:{
+				id:'',
+				access_key: '',
+				secret_key: '',
+				region: ''
+			},
+			onedata:{
+				id:'',
+				oneprovider_host: '',		
+				token: '',		
+				space: ''
+			},
+
+			form: {
+				valid: false,
+				image: '',
+				imageRules: [
+				v => !!v || 'Docker image is required',
+				// v => (v && v.includes('/')) || 'The Docker image must comply with the nomenclature of Docker Hub images'
+				// && /.+:.+/.test(v)
+				],
+				name: '',
+				nameRules: [
+				v => !!v || 'Function name is required'
+				],
+				envVarskey: "",
+				envVarsValue: "",	
+				annotkey:"",
+				annotvalue:"",
+				labelskey:"",
+				labelsvalue:"",
+				path_in:"",
+				log_level:['CRITICAL','ERROR','WARNING','INFO','DEBUG','NOTSET'],
+				storage_provider_in:"",
+				prefix_in:"",
+				suffix_in:"",
+				path_out:"",
+				storage_provider_out:"",
+				prefix_out:"",
+				suffix_out:"",
+				storage_provider:{
+					// s3:{
+					// 	access_key: '',
+					// 	secret_key: '',
+					// 	region: ''
+					// },
+					// onedata:{
+					// 	oneprovider_host: '',		
+					// 	token: '',		
+					// 	space: ''
+					// },
+				},
+				limits_cpu: '',
+				limits_memory: '',
+				regAuth: '',
+				request_cpu: '',
+				request_memory: '',
+				secrets: '',
+				script: '',
+				
+				
+			},
+			progress: {
+				active: false
+			},
+			model_create: 'tab-minio',
+			tabs_in_out: 'tab-input',
+			showinput: true,
+			memory: '',
+			varsEnv: '',
+			editScript: false,
+			storages_all:[],
+			select_tab:'',
+			disabled_submit:false
+
+
+		}
+	},
+	watch:{
+		"select_tab"(val){
+			if(val == 'input_output'){				
+					this.storages_all.push("minio.default")				
+			}
+
+		}
+	},
+	methods: {
+		editSummernote(){
+			var _this = this
+            $('.summernote').summernote(
+                {
+					callbacks:{
+						onInit: function() {
+							 $('.summernote').summernote('codeview.activate');
+						},		
+					},
+					codeviewFilter: true,
+  					codeviewIframeFilter: true,
+					focus: true,
+					height: 200,                 // set editor height
+					minHeight: null,             // set minimum height of editor
+					maxHeight: null,             // set maximum height of editor
+                    toolbar: [
+                        // [groupName, [list of button]]
+                        ['style', ['bold', 'italic', 'underline', 'clear']],
+                        ['font', ['strikethrough', 'superscript', 'subscript']],
+                        ['fontsize', ['fontsize']],
+                        ['color', ['color']],
+                        ['para', ['ul', 'ol', 'paragraph']],
+						['height', ['height']],
+						['view', ['codeview']]
+					],
+					codemirror: { // codemirror options
+						theme: 'monokai',
+						lineNumbers: true,
+						lineWrapping: true,
+    					tabMode: 'indent'
+					},
+					
+                })
+                .on("summernote.enter", function(we, e) {
+                    $(this).summernote("pasteHTML", "<br><br>");
+                    e.preventDefault();
+				});
+				 $('.summernote').summernote('code',_this.base64String)
+        },
+        saveSummernote(){
+			this.base64String = $('.summernote').summernote('code')
+			$('.summernote').summernote('destroy');
+			setTimeout(function(){
+				$('.summernote').css('display','none');
+			},100)
+            this.editScript = false
+        },
+
+		show(id){
+			$("#myTabContent .tab-pane-content").removeClass("show active")
+			$("#myTab .nav-link").removeClass("show active")
+			$("#"+id).addClass("show active")
+			$("#"+id+"-tab").addClass("show active")
+			this.select_tab = id
+		},
+		show_input(id){
+			$("#myTabContentInOut .tab-pane-inout").removeClass("show active")
+			$("#myTabInOut .nav-link").removeClass("show active")
+			$("#"+id).addClass("show active")
+			$("#"+id+"-tab").addClass("show active")
+		},
+		
+		handleUpdate(){
+			this.$emit("SHOWSPINNER",true)			 
+      		window.getApp.$emit('REFRESH_BUCKETS_LIST')
+      		window.getApp.$emit('BUCKETS_REFRESH_DASHBOARD')
+      		window.getApp.$emit('FUNC_GET_FUNCTIONS_LIST')
+    	},
+		cleanfield(){
+			this.url=""
+		},
+		cleanfieldenv(){
+			this.form.envVarskey=""
+			this.form.envVarsValue=""
+		},		
+		cleanfieldAnn(){
+			this.form.annotkey=""
+			this.form.annotvalue=""
+		},		
+		cleanfieldLabels(){
+			this.form.labelskey=""
+			this.form.labelsvalue=""
+		},		
+		cleanfieldInput(){
+			this.form.path_in=""		
+			this.form.storage_provider_in=""	
+			this.cleanfieldPrefixIn()	
+			this.cleanfieldSuffixIn()	
+		},
+		cleanfieldPrefixIn(){
+			this.form.prefix_in=""		
+		},
+		cleanfieldSuffixIn(){
+			this.form.suffix_in=""		
+		},
+		includePrefixIn(){
+			if(this.form.prefix_in != null && this.form.prefix_in != ''){
+				this.showselectPrefixIn = true
+				this.prefixs_in.push(this.form.prefix_in)
+				this.cleanfieldPrefixIn()
+			}
+		},
+		includeSuffixIn(){
+			if(this.form.suffix_in != null && this.form.suffix_in != ''){
+				this.showselectSuffixIn = true
+				this.suffixs_in.push(this.form.suffix_in)
+				this.cleanfieldSuffixIn()
+			}
+		},
+		includeInput(){
+			if(this.form.storage_provider_in=='' || this.form.path_in==''){
+				this.showErrorInput = true
+			}else{
+				this.showErrorInput = false
+				this.showselectInput=true
+				var input = {
+					"path":this.form.path_in,
+					"storage_provider":this.form.storage_provider_in,
+					"prefix":this.prefixs_in,
+					"suffix":this.suffixs_in
+				}
+				this.inputs.push(input)
+				input = {}
+				this.prefixs_in=[]
+				this.suffixs_in=[]
+				this.cleanfieldInput()						
+				this.cleanfieldPrefixIn()						
+				this.cleanfieldSuffixIn()	
+				if (this.isEmpty(this.prefixs_in)) {
+					this.showselectPrefixIn = false
+				}
+				if (this.isEmpty(this.suffixs_in)) {
+					this.showselectSuffixIn = false
+				}					
+			}
+		},
+		cleanfieldOutput(){
+			this.form.path_out=""		
+			this.form.storage_provider_out=""	
+			this.cleanfieldPrefixOut()	
+			this.cleanfieldSuffixOut()	
+		},
+		cleanfieldPrefixOut(){
+			this.form.prefix_out=""		
+		},
+		cleanfieldSuffixOut(){
+			this.form.suffix_out=""		
+		},
+		includePrefixOut(){
+			if(this.form.prefix_out != null && this.form.prefix_out != ''){
+				this.showselectPrefixOut = true
+				this.prefixs_out.push(this.form.prefix_out)
+				this.cleanfieldPrefixOut()
+			}
+		},
+		includeSuffixOut(){
+			if(this.form.suffix_out != null && this.form.suffix_out != ''){
+				this.showselectSuffixOut = true
+				this.suffixs_out.push(this.form.suffix_out)
+				this.cleanfieldSuffixOut()
+			}
+		},
+		includeOutput(){
+			if(this.form.storage_provider_out=='' || this.form.path_out==''){
+				this.showErrorOutput = true
+			}else{
+				this.showErrorOutput = false
+				this.showselectOutput=true
+				var output = {
+					"path":this.form.path_out,
+					"storage_provider":this.form.storage_provider_out,
+					"prefix":this.prefixs_out,
+					"suffix":this.suffixs_out
+				}
+				this.outputs.push(output)
+				output = {}
+				this.prefixs_out=[]
+				this.suffixs_out=[]
+				this.cleanfieldOutput()						
+				this.cleanfieldPrefixOut()						
+				this.cleanfieldSuffixOut()	
+				if (this.isEmpty(this.prefixs_out)) {
+					this.showselectPrefixOut = false
+				}
+				if (this.isEmpty(this.suffixs_out)) {
+					this.showselectSuffixOut = false
+				}	
+			}				
+		},
+		includeEnv(){
+			if(this.form.envVarskey != null && this.form.envVarskey != '' && this.form.envVarsValue != null && this.form.envVarsValue != ''){
+				this.showselectEnv=true
+				var key= this.form.envVarskey.replace(" ", "")
+				var value = this.form.envVarsValue.replace(" ", "")
+				this.envVars[key]=value
+				this.cleanfieldenv()						
+			}
+		},		
+		includeAnnot(){
+			if(this.form.annotkey != null && this.form.annotkey != '' && this.form.annotvalue != null && this.form.annotvalue != ''){
+				this.showselectAnn=true
+				var key= this.form.annotkey.replace(" ", "")
+				var value = this.form.annotvalue.replace(" ", "")
+				this.annotations[key]=value
+				this.cleanfieldAnn()						
+			}
+		},		
+		includeLabels(){
+			if(this.form.labelskey != null && this.form.labelskey != '' && this.form.labelsvalue != null && this.form.labelsvalue != ''){
+				this.showselectLabel=true
+				var key= this.form.labelskey.replace(" ", "")
+				var value = this.form.labelsvalue.replace(" ", "")
+				this.labels[key]=value
+				this.cleanfieldLabels()						
+			}
+		},		
+		includeOneData(){
+			if(this.onedata.id=='' || this.onedata.oneprovider_host=='' || this.onedata.token=='' || this.onedata.space==''){
+				this.showErrorOneData = true
+				}else{
+				this.showErrorOneData = false
+				this.showOneData = true;
+				var value_onedata = {
+					"oneprovider_host": this.onedata.oneprovider_host,
+					"token": this.onedata.token,
+					"space": this.onedata.space
+				}
+				this.ONEDATA_DICT[this.onedata.id]=value_onedata;
+				if (this.isEmpty(this.ONEDATA_DICT)) {
+					this.showOneData = false
+				}
+				this.storages_all.push('onedata.'+this.onedata.id)
+				value_onedata = ''
+				this.cleanfieldOneData()
+			}
+			
+		},
+		cleanfieldOneData(){
+			this.onedata.id=''
+			this.onedata.oneprovider_host = ''
+			this.onedata.space = ''
+			this.onedata.token = ''
+		},
+		removeOneData(item){
+			this.$delete(this.ONEDATA_DICT,item)			
+			if (this.isEmpty(this.ONEDATA_DICT)) {
+				this.showOneData = false
+			}	
+
+		},
+		includeMinio(){
+			if(this.minio.id=='' || this.minio.endpoint=='' || this.minio.region=='' || this.minio.secret_key=='' || this.minio.access_key==''){
+				this.showErrorMinio = true
+			}else{
+				this.showErrorMinio = false
+				this.showMinio = true;
+				var value_minio = {
+					"endpoint": this.minio.endpoint,
+					"region": this.minio.region,
+					"secret_key": this.minio.secret_key,
+					"access_key": this.minio.access_key,
+					"verify": this.minio.verify
+				}
+				this.MINIO_DICT[this.minio.id]=value_minio;
+				if (this.isEmpty(this.MINIO_DICT)) {
+					this.showMinio = false
+				}
+				
+				this.storages_all.push("minio."+this.minio.id)
+				value_minio = ''
+				this.cleanfieldMinio()
+			}
+			
+		},
+		cleanfieldMinio(){
+			this.minio.id=''
+			this.minio.endpoint = ''
+			this.minio.region = ''
+			this.minio.secret_key = ''
+			this.minio.access_key = ''
+			this.minio.verify = true
+		},
+		removeMinio(item){
+			this.$delete(this.MINIO_DICT,item)			
+			if (this.isEmpty(this.MINIO_DICT)) {
+				this.showMinio = false
+			}	
+
+		},
+		includeS3(){
+			if(this.s3.id=='' || this.s3.region=='' || this.s3.secret_key=='' || this.s3.access_key==''){
+				this.showErrorS3 = true
+			}else{
+				this.showErrorS3 = false
+				this.showS3 = true;
+				var value_s3 = {
+					"access_key": this.s3.access_key,
+					"secret_key": this.s3.secret_key,
+					"region": this.s3.region
+				}
+				this.S3_DICT[this.s3.id]=value_s3;
+				if (this.isEmpty(this.S3_DICT)) {
+					this.showS3 = false
+				}
+				this.storages_all.push("s3."+this.s3.id)
+				value_s3 = ''
+				this.cleanfieldS3()
+			}
+			
+		},
+		cleanfieldS3(){
+			this.s3.id=''
+			this.s3.access_key = ''
+			this.s3.secret_key = ''
+			this.s3.region = ''
+		},
+		removeS3(item){
+			this.$delete(this.S3_DICT,item)			
+			if (this.isEmpty(this.S3_DICT)) {
+				this.showS3 = false
+			}	
+
+		},
+		isEmpty(obj) {
+			for(var key in obj) {
+				if(obj.hasOwnProperty(key))
+					return false;
+			}
+			return true;
+		},
+		removeEnv (key) {     
+			this.$delete(this.envVars,key)			
+			if (this.isEmpty(this.envVars)) {
+				this.showselectEnv = false
+			}		
+		},	
+		removeAnn (key) {     
+			this.$delete(this.annotations,key)			
+			if (this.isEmpty(this.annotations)) {
+				this.showselectAnn = false
+			}		
+		},	
+		removeLabels (key) {     
+			this.$delete(this.labels,key)			
+			if (this.isEmpty(this.labels)) {
+				this.showselectLabel = false
+			}		
+		},	
+		removeInput (key) {     
+			this.$delete(this.inputs,key)			
+			if (this.isEmpty(this.inputs)) {
+				this.showselectInput = false
+			}		
+		},
+		removeOutput (key) {     
+			this.$delete(this.outputs,key)			
+			if (this.isEmpty(this.outputs)) {
+				this.showselectOutput = false
+			}		
+		},
+		removePrefixIn (key) {     
+			this.$delete(this.prefixs_in,key)			
+			if (this.isEmpty(this.prefixs_in)) {
+				this.showselectPrefixIn = false
+			}		
+		},
+		removePrefixOut (key) {     
+			this.$delete(this.suffixs_out,key)			
+			if (this.isEmpty(this.suffixs_in)) {
+				this.showselectPrefixOut = false
+			}		
+		},
+		removeSuffixIn (key) {     
+			this.$delete(this.suffixs_in,key)			
+			if (this.isEmpty(this.suffixs_in)) {
+				this.showselectSuffixIn = false
+			}		
+		},	
+		removeSuffixOut (key) {     
+			this.$delete(this.suffixs_out,key)			
+			if (this.isEmpty(this.suffixs_out)) {
+				this.showselectSuffixOut = false
+			}		
+		},	
+		collapse(){			
+			this.drawer = (!this.drawer)			
+			if (this.drawer == true){
+				this.expand = "expand_less"
+				$("#panel").slideDown("slow");
+
+			}else{
+				this.expand = "expand_more"
+				$("#panel").slideUp("slow");
+			}			
+		},
+		addFiles () {      		
+			this.$refs.files.click()		
+		},
+		removeFile (key) {     
+			this.files.splice(key, 1)
+			this.$refs.files.value = null
+			// this.base64String = ''
+			$('.summernote').summernote('destroy');
+			setTimeout(function(){
+				$('.summernote').css('display','none');
+			},100)
+		},		
+		handleFilesUpload () {
+			this.files = []      
+			let uploadedFiles = this.$refs.files.files			
+			this.filerequire = false
+			/*
+				Adds the uploaded file to the files array
+			*/
+			for (let i = 0; i < uploadedFiles.length; i++) {
+				this.showUploading = false
+				this.filename = uploadedFiles[i].name
+				this.files.push(uploadedFiles[i])
+			}			
+			if (window.File && window.FileReader && window.FileList && window.Blob) {
+				var f = this.files[0]; // FileList object
+				
+				var reader = new FileReader();
+				// Closure to capture the file information.
+				var _this = this;
+				reader.onload = (function(theFile) {
+				return function(e) {
+					var binaryData = e.target.result;
+
+					//Reading as String
+					_this.base64String = binaryData
+					//Converting Binary Data to base 64
+					// _this.base64String = window.btoa(binaryData);
+				};
+				})(f);
+				// Read in the image file as a data URL.
+				// reader.readAsBinaryString(f);
+				// reader.readAsBinaryString(f);
+				reader.readAsText(f)
+			} else {
+				alert('The File APIs are not fully supported in this browser.');
+			}      
+		
+		},
+		readurl(){     
+			if(this.url != '' && this.url!=null){
+				this.files = [] 		
+				let uploadedFiles = this.url						
+				this.showUploading = false
+				this.filename = this.url
+				this.files.push(uploadedFiles)
+				var _this = this
+				fetch(this.url).then(r => r.blob()).then(blob => {
+					var reader = new FileReader();
+					reader.onload = function() {
+						_this.base64String = reader.result.replace(/^data:.+;base64,/, '');
+						// Convert to string because new OSCAR version doesn't need base64
+						_this.base64String = atob(_this.base64String)
+					};
+					reader.readAsDataURL(blob);
+				});
+				this.cleanfield()
+			}
+		},
+		closeWithoutSave() {      
+			this.progress.active = false
+			this.dialog = false            
+			this.clear()      
+		},
+		extend(obj, src) {
+				for (var key in src) {
+					if (src.hasOwnProperty(key)) obj[key] = src[key];
+				}
+				return obj;
+		},
+		submit () {	
+
+			if(this.$refs.form.validate() && this.editionMode == true && this.base64String != ''){
+					this.editFunction()
+			}else if (this.$refs.form.validate() && this.files.length != 0) {
+				this.progress.active = true
+				this.editionMode ? this.editFunction() : this.newFunction()				
+				this.envrequirehost = false
+				this.envrequiretoken = false
+				this.envrequirespace = false
+			}else {
+				if (this.files.length == 0){
+					this.filerequire = true
+				}else{
+					this.filerequire = false
+				}	
+				this.show('home')
+			}
+						
+					
+						
+		},
+		clearHome(){
+			this.files = []
+			this.url = ""
+			this.$refs.files.value = null
+			this.showUploading = false
+			this.showselectEnv = false
+			this.envVars = {}
+			this.expand = "expand_more"
+			$("#panel").slideUp("slow");
+			$("#home-tab").addClass("show active")
+			$("#home").addClass("show active")
+			$("#input_output-tab").removeClass("show active")
+			$("#input_output").removeClass("show active")
+			$("#profile-tab").removeClass("show active")
+			$("#profile").removeClass("show active")
+			this.select_logLevel = 'INFO'
+			this.editScript = false
+			this.form.limits_cpu=''
+			this.form.limits_memory=''
+			this.form.image=''
+			this.form.name=''
+		},
+		clear () {
+			this.files = []
+			this.url = ""
+			this.$refs.files.value = null
+			this.$refs.form.reset()
+			this.editionMode = false
+			this.showUploading = false
+			this.showselectEnv = false
+			this.envVars = {}
+			this.anns = {}
+			this.labels = {}
+			this.expand = "expand_more"
+			$("#panel").slideUp("slow");
+			$("#home-tab").addClass("show active")
+			$("#home").addClass("show active")
+			$("#input_output-tab").removeClass("show active")
+			$("#input_output").removeClass("show active")
+			$("#profile-tab").removeClass("show active")
+			$("#profile").removeClass("show active")
+			this.minio.access_key = ''
+			this.minio.secret_key = ''
+			this.minio.endpoint = ''
+			this.minio.verify = true
+			this.onedata.oneprovider_host = ''
+			this.onedata.token = ''
+			this.onedata.space = ''
+			this.s3.access_key = ''
+			this.s3.secret_key = ''
+			this.s3.region = ''
+			this.prefixs_in = []
+			this.suffixs_in = []
+			this.inputs = []
+			this.cleanfieldInput()
+			this.prefixs_out = []
+			this.suffixs_out = []
+			this.outputs = []
+			this.cleanfieldOutput()
+			this.cleanfieldOneData()
+			this.cleanfieldMinio()
+			this.cleanfieldS3()
+			this.showselectPrefixIn = false
+			this.showselectSuffixIn = false
+			this.showselectPrefixOut = false
+			this.showselectSuffixOut = false
+			this.showselectInput = false
+			this.showselectOutput = false
+			this.select_logLevel = 'INFO'
+			this.editScript = false
+			this.storages_all = []
+			this.ONEDATA_DICT={}
+			this.MINIO_DICT={}
+			this.S3_DICT={}
+			this.showOneData=false
+			this.showMinio=false
+			this.showS3=false
+			this.base64String = ''
+			$('.summernote').summernote('destroy');
+			setTimeout(function(){
+				$('.summernote').css('display','none');
+			},100)
+			this.show_input('input')
+			
+		},
+		newFunction () {
+			if (this.isEmpty(this.MINIO_DICT)==false) {
+				this.form.storage_provider["minio"]=this.MINIO_DICT
+			}
+			if (this.isEmpty(this.S3_DICT)==false){
+				this.form.storage_provider["s3"]=this.S3_DICT
+			}
+			if (this.isEmpty(this.ONEDATA_DICT)==false){
+				this.form.storage_provider["onedata"]=this.ONEDATA_DICT
+			}
+			
+			var value = $("#classmemory option:selected").text();			
+				
+
+			if (this.form.limits_memory == ""){
+				this.limits_mem = ''
+			}else{
+				this.limits_mem = this.form.limits_memory + value;
+			}
+
+			var params = {
+				
+				'name': this.form.name, 
+				'image': this.form.image, 
+				'cpu': this.form.limits_cpu,
+				'memory': this.limits_mem,
+				'log_level': this.select_logLevel,
+				'environment': {
+					"Variables":this.envVars
+				},
+				'annotations':this.annotations,
+				'labels':this.labels,
+				'input': this.inputs,
+				'output': this.outputs,
+				'script': this.base64String,
+				'storage_providers':this.form.storage_provider
+
+			}
+			this.createServiceCall(params,this.createServiceCallBack)	
+			
+		},
+		createServiceCallBack(response){
+			if(response.status == 201){
+				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: `Function ${this.form.name} was successfully created.`, color: 'success', timeout: 12000 })
+				this.dialog = false;
+				this.clear()
+				this.updateFunctionsGrid()
+				window.getApp.$emit('REFRESH_BUCKETS_LIST')
+
+			}else {
+				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: response, color: 'error' })
+			}
+			this.progress.active = false
+
+		},
+		editFunction () {
+			if (this.isEmpty(this.MINIO_DICT)==false) {
+				this.form.storage_provider["minio"]=this.MINIO_DICT
+			}
+			if (this.isEmpty(this.S3_DICT)==false){
+				this.form.storage_provider["s3"]=this.S3_DICT
+			}
+			if (this.isEmpty(this.ONEDATA_DICT)==false){
+				this.form.storage_provider["onedata"]=this.ONEDATA_DICT
+			}
+			
+			var value = $("#classmemory option:selected").text();
+			if (this.form.limits_memory == ""){
+				this.limits_mem = ''
+			}else{
+				this.limits_mem = this.form.limits_memory + value;
+			}
+			var script = ''
+			if (this.script == '') {
+				script = this.base64String
+			}else{
+				script = this.script
+			}
+			var params = {
+				
+				'name': this.form.name, 
+				'image': this.form.image, 
+				'cpu': this.form.limits_cpu,
+				'memory': this.limits_mem,
+				'log_level': this.select_logLevel,
+				'environment': {
+					"Variables":this.envVars
+				},
+				'annotations':this.annotations,
+				'labels':this.labels,
+				'input': this.inputs,
+				'output': this.outputs,
+				'script': this.base64String,
+				'storage_providers':this.form.storage_provider
+
+			}	
+			this.progress.active = true;
+			this.disabled_submit = true;
+			this.editServiceCall(params, this.editServiceCallBack)
+			
+		},
+		editServiceCallBack(response){
+			if(response.status == 204){
+				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: `Function ${this.form.name} has been updated`, color: 'success' })
+				this.dialog = false;
+				this.clear()
+				this.updateFunctionsGrid()
+				
+			}else {
+				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: response, color: 'error' })
+			}
+			this.progress.active = false;
+			this.disabled_submit = false;
+
+
+		},
+		updateFunctionsGrid () {
+			window.getApp.$emit('FUNC_GET_FUNCTIONS_LIST')
+			window.getApp.$emit('REFRESH_BUCKETS_LIST')
+		}
+	},
+	computed: {
+		
+		formTitle () {
+			return this.editionMode ? 'Edit Service' : 'New Service'
+		},
+		formColor () {
+			return this.editionMode ? 'blue lighten-2' : 'teal lighten-3'
+		},
+		showSelectedFiles () {
+			return this.files.length > 0
+		},
+		
+	},
+  
+	created: function () {
+		this.select_logLevel = 'INFO';
+		window.getApp.$on('FUNC_OPEN_MANAGEMENT_DIALOG', (data) => {
+			this.dialog = true
+			this.editionMode = data.editionMode
+			this.form.name = data.name
+			this.form.image = data.image
+			this.inputs = data.input
+			this.outputs = data.output
+			this.form.limits_cpu = data.cpu
+			var memory_split = []
+			memory_split = data.memory.match(/[a-z]+|[^a-z]+/gi);
+			this.form.limits_memory = memory_split[0]
+			if (memory_split[1] == "Mi"){
+				var value_select = "1"
+			}else{
+				var value_select = "2"
+			}
+			setTimeout(function(){
+				$('#classmemory').val(value_select)
+			},100)
+			var key=''
+			var values= ''
+			key = Object.keys(data.envVars.Variables)
+			values = Object.values(data.envVars.Variables)
+			for (let i = 0; i < key.length; i++) {
+				this.envVars[key[i]]=values[i]
+			}
+			if(key.length > 0){
+				this.showselectEnv = true
+			}else{
+				this.showselectEnv = true
+			}			
+			if(Object.keys(data.annotations).length > 0){
+				this.annotations = data.annotations;
+				this.showselectAnn = true;
+			}else{
+				this.annotations = {};
+				this.showselectAnn = false;
+				
+			}
+			if(Object.keys(data.labels).length > 0){
+				this.labels = data.labels;
+				this.showselectLabel = true;
+			}else{
+				this.showselectLabel = false;
+				this.labels = {};
+			}
+			
+			this.select_logLevel = data.log_Level
+			if (this.isEmpty(this.inputs)) {
+				this.showselectInput = false
+			}else{
+				this.showselectInput = true
+			}	
+			if (this.isEmpty(this.outputs)) {
+				this.showselectOutput = false
+			}else{
+				this.showselectOutput = true
+			}
+			this.base64String = data.script
+			this.MINIO_DICT=data.storage_provider.minio
+			this.ONEDATA_DICT=data.storage_provider.onedata
+			this.S3_DICT=data.storage_provider.s3
+			this.storages_all=[]
+			if (this.isEmpty(this.MINIO_DICT)) {
+				this.showMinio = false
+			}else{
+				this.showMinio = true
+				this.storages_all.push('minio.'+Object.keys(this.MINIO_DICT))
+			}
+			if (this.isEmpty(this.ONEDATA_DICT)) {
+				this.showOneData = false
+			}else{
+				this.showOneData = true
+				this.storages_all.push('onedata.'+Object.keys(this.ONEDATA_DICT))
+			}
+			if (this.isEmpty(this.S3_DICT)) {
+				this.S3_DICT = false
+			}else{
+				this.S3_DICT = true
+				this.storages_all.push('s3.'+Object.keys(this.S3_DICT))
+
+			}
+		})
+	}
+}
+</script>
+
+<style scoped>
+
+.hide_text{
+	/* content:'*************'!important; */
+	-webkit-text-security: disc!important;
+	-moz-text-security: disc!important;
+	/* text-security: disc; */
+}
+
+.active {
+	color: black !important;
+  	background-color: transparent !important;
+  	border-bottom: yellowgreen solid 2px;
+}
+.list__tile {
+  height: 6rem !important;
+}
+ #flip {
+    /* padding: 5px; */
+    /* text-align: center; */
+    background-color: #e5eecc;
+    border: solid 1px #c3c3c3;
+}
+
+#panel {
+    /* padding: 50px; */
+    display: none;
+}
+
+#test {
+  text-align: left,
+}
+.v-btn.v-btn--outline {
+    border: none;
+    background: transparent !important;
+    box-shadow: none;
+}
+
+	/* Small devices (landscape phones, 576px and up)*/
+@media (min-width: 576px) { 
+		.custom-select{
+		height: calc(2.25rem + 3px);
+		width: 100%
+	}
+	}
+
+/*Medium devices (tablets, 768px and up)*/
+@media (min-width: 768px) { 
+	.custom-select{
+		height: calc(2.25rem + 3px);
+		width: 100%
+	}
+	}
+
+/*Large devices (desktops, 992px and up)*/
+@media (min-width: 992px) { 
+	.custom-select{
+		height: calc(2.25rem + 3px);
+		width: 100%
+	}
+	}
+
+/* Extra large devices (large desktops, 1200px and up)*/
+@media (min-width: 1200px) { 
+	.custom-select{
+		height: calc(2.25rem + 3px);
+		width: 75%
+	}
+}
+</style>
diff --git a/vue_app/src/components/services.js b/src/components/services.js
similarity index 82%
rename from vue_app/src/components/services.js
rename to src/components/services.js
index 9d941ab..bbf5636 100644
--- a/vue_app/src/components/services.js
+++ b/src/components/services.js
@@ -1,10 +1,10 @@
 import JSZip from "jszip";
 import JSZipUtils from "jszip-utils"
-import qs from 'qs'
+import env from '../env'
 export default {
     data: () => {
 		return {
-            api: 'http://158.42.105.147:30301',  
+            api: env.api,
             minioClient: '',  
             username_auth:'',
             password_auth:''        
@@ -23,10 +23,8 @@ export default {
 
         var Minio = require('minio')
         this.minioClient = new Minio.Client({
-            // endPoint: minio_endpoint,    
-            endPoint: '158.42.105.147',    
-            port: 30300,   
-            // port: parseInt(minio_port),   
+            endPoint: minio_endpoint,    
+            port: parseInt(minio_port),   
             useSSL: true,
             accessKey: minio_accessKey,
             secretKey: minio_secretKey
@@ -63,7 +61,7 @@ export default {
                     password: this.password_auth
                 }
             }).then(function (response) {
-                callBackHandler(response.data);
+                callBackHandler(response);
             }.bind(this)).catch(function (error) {
                 callBackHandler(error);
             })
@@ -71,7 +69,7 @@ export default {
         deleteServiceCall(params, callBackHandler) {
             axios({
                 method: 'delete',
-                url: this.api + '/system/services/'+params,
+                url: this.api+'/system/services/'+params,
                 auth: {
                     username: this.username_auth,
                     password: this.password_auth
@@ -93,14 +91,14 @@ export default {
                 }
             }).then(function (response) {
                 callBackHandler(response.data);
-            }).catch(function (error) {
+            }.bind(this)).catch(function (error) {
                 callBackHandler(error);
             })
         },
         deleteJobCall(params, callBackHandler) {
             axios({
                 method: 'delete',
-                url: this.api + '/system/logs/'+params.serviceName+'/'+params.jobName,
+                url:  this.api+'/system/logs/'+params.serviceName+'/'+params.jobName,
                 auth: {
                     username: this.username_auth,
                     password: this.password_auth
@@ -108,7 +106,7 @@ export default {
                 data:params,
             }).then(function (response) {
                 callBackHandler(response);
-            }).catch(function (error) {
+            }.bind(this)).catch(function (error) {
                 callBackHandler(error);
             })
         },
@@ -121,8 +119,8 @@ export default {
                     password: this.password_auth
                 }
             }).then(function (response) {
-                callBackHandler(response.data);
-            }).catch(function (error) {
+                callBackHandler(response);
+            }.bind(this)).catch(function (error) {
                 callBackHandler(error);
             })
         },
@@ -133,13 +131,14 @@ export default {
                 auth: {
                     username: this.username_auth,
                     password: this.password_auth
-                },     
+                }
             }).then(function (response) {
                 callBackHandler(response);
-            }).catch(function (error) {
+            }.bind(this)).catch(function (error) {
                 callBackHandler(error);
             })
-        },               
+        },
+        
         createServiceCall(params, callBackHandler){
             axios({
                 method: 'post',
@@ -212,7 +211,7 @@ export default {
         },
 
         getBucketFilesCall(params, callBackHandler){
-            let stream = this.minioClient.listObjects(params.name, params.prefix, true,) 
+            let stream = this.minioClient.listObjectsV2(params.name, params.prefix, true) 
             var funct = {
                 err : "",
                 files: []
@@ -220,7 +219,6 @@ export default {
             stream.on('data', function(obj) 
             {   
                 funct.files.push(obj);
-                
             })    
             stream.on('error', function(err) 
             {       
@@ -325,7 +323,7 @@ export default {
             var _this = this
 
             // List all object paths in bucket my-bucketname.
-            var objectsStream = this.minioClient.listObjects(params, '', true)
+            var objectsStream = this.minioClient.listObjectsV2(params, '', true)
 
             objectsStream.on('data', function(obj) {
             objectsList.push(obj.name);
@@ -336,23 +334,43 @@ export default {
             })
 
             objectsStream.on('end', function() {
-
-            _this.minioClient.removeObjects(params,objectsList, function(e) {
-                if (e) {
-                    return console.log('Unable to remove Objects ',e)
+                var files_count = objectsList.length;                
+                if(objectsList.length != 0){
+                    for (let i = 0; i < objectsList.length; i++) {
+                        _this.minioClient.removeObject(params,objectsList[i], function(e) {
+                            if (e) {
+                                return console.log('Unable to remove Objects ',e)
+                            }
+                            files_count = files_count - 1;
+                            if(files_count == 0){
+                                _this.minioClient.removeBucket(params, function(err, exists) {    
+                                    if (err){
+                                        callBackHandler(err)
+                                    }else{
+                                        callBackHandler('success');        
+                                    }             
+                                        
+                                })
+                            }
+                        })
+                        console.log('Removed the objects successfully')
+                    }
+                    
+                }else{
+                    _this.minioClient.removeBucket(params, function(err, exists) {    
+                        console.log(err)
+                        if (err){
+                            callBackHandler(err)
+                        }else{
+                            callBackHandler('success');        
+                        }             
+                            
+                    })
                 }
-                _this.minioClient.removeBucket(params, function(err, exists) {    
-                    console.log(err)
-                    if (err){
-                        callBackHandler(err)
-                    }else{
-                        callBackHandler('success');        
-                    }             
-                        
-                })
-                console.log('Removed the objects successfully')
-            })
 
+                
+
+                           
             })
             
         },
diff --git a/vue_app/src/components/widgets/InputFile.vue b/src/components/widgets/InputFile.vue
similarity index 100%
rename from vue_app/src/components/widgets/InputFile.vue
rename to src/components/widgets/InputFile.vue
diff --git a/vue_app/src/components/widgets/list/NotificationList.vue b/src/components/widgets/list/NotificationList.vue
similarity index 100%
rename from vue_app/src/components/widgets/list/NotificationList.vue
rename to src/components/widgets/list/NotificationList.vue
diff --git a/src/env.js b/src/env.js
new file mode 100644
index 0000000..075b2a2
--- /dev/null
+++ b/src/env.js
@@ -0,0 +1,8 @@
+module.exports = {
+    "provider_url": "https://aai-dev.egi.eu",
+    "client_id": "10333f08-7e8f-4cc4-bba0-e66f4e5505d0",
+    "redirect_uri" : "http://localhost:8080/callback.html",
+    "url_authorize": "https://aai-dev.egi.eu/oidc/authorize",
+    "url_user_info": "https://aai-dev.egi.eu/oidc/userinfo",
+    "api" : "http://localhost", // value of the api
+}
diff --git a/vue_app/src/event.js b/src/event.js
similarity index 100%
rename from vue_app/src/event.js
rename to src/event.js
diff --git a/vue_app/src/img/OpenFaaS.png b/src/img/OpenFaaS.png
similarity index 100%
rename from vue_app/src/img/OpenFaaS.png
rename to src/img/OpenFaaS.png
diff --git a/vue_app/src/img/amazon-s3.png b/src/img/amazon-s3.png
similarity index 100%
rename from vue_app/src/img/amazon-s3.png
rename to src/img/amazon-s3.png
diff --git a/vue_app/src/img/logo_one_data.jpg b/src/img/logo_one_data.jpg
similarity index 100%
rename from vue_app/src/img/logo_one_data.jpg
rename to src/img/logo_one_data.jpg
diff --git a/vue_app/src/img/minio-storage.png b/src/img/minio-storage.png
similarity index 100%
rename from vue_app/src/img/minio-storage.png
rename to src/img/minio-storage.png
diff --git a/vue_app/src/img/minio.png b/src/img/minio.png
similarity index 100%
rename from vue_app/src/img/minio.png
rename to src/img/minio.png
diff --git a/vue_app/src/main.js b/src/main.js
similarity index 82%
rename from vue_app/src/main.js
rename to src/main.js
index bc0252a..dbdb0e2 100644
--- a/vue_app/src/main.js
+++ b/src/main.js
@@ -3,6 +3,7 @@ import './plugins/vuetify'
 import App from './App.vue'
 import router from './router/index'
 import './registerServiceWorker'
+import env from './env.js'
 // import VueMaterial from 'vue-material'
 // import 'vue-material/dist/vue-material.min.css'
 
@@ -12,6 +13,14 @@ Vue.config.productionTip = false
 window.axios = require('axios');
 window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 
+Vue.mixin({
+  data: function(){
+    return {
+      env:env,
+    }
+  }
+})
+
 new Vue({
   router,
   render: h => h(App)
diff --git a/vue_app/src/plugins/vuetify.js b/src/plugins/vuetify.js
similarity index 100%
rename from vue_app/src/plugins/vuetify.js
rename to src/plugins/vuetify.js
diff --git a/vue_app/src/registerServiceWorker.js b/src/registerServiceWorker.js
similarity index 100%
rename from vue_app/src/registerServiceWorker.js
rename to src/registerServiceWorker.js
diff --git a/vue_app/src/router/index.js b/src/router/index.js
similarity index 100%
rename from vue_app/src/router/index.js
rename to src/router/index.js
diff --git a/vue_app/src/router/paths.js b/src/router/paths.js
similarity index 100%
rename from vue_app/src/router/paths.js
rename to src/router/paths.js
diff --git a/vue_app/src/util/index.js b/src/util/index.js
similarity index 100%
rename from vue_app/src/util/index.js
rename to src/util/index.js
diff --git a/vue_app/src/views/BucketContent.vue b/src/views/BucketContent.vue
similarity index 98%
rename from vue_app/src/views/BucketContent.vue
rename to src/views/BucketContent.vue
index e6cf0d3..cefe58b 100644
--- a/vue_app/src/views/BucketContent.vue
+++ b/src/views/BucketContent.vue
@@ -160,7 +160,7 @@
 				</template>
 				<template slot="items" slot-scope="props" expand="true">
 					<tr :active="props.selected"  @mouseover="c_index=props.index" @mouseleave="c_index=-1" >
-					<td class="justify-center" @click="props.selected = !props.selected" >
+					<td v-if="props.item.name!=''" class="justify-center" @click="props.selected = !props.selected" >
 						<v-icon v-show="c_index!=props.index && props.selected != true" :color="props.item.color">{{props.item.icon}}</v-icon>
 						<v-checkbox
 							:input-value="props.selected"
@@ -168,15 +168,21 @@
 							hide-details
 							v-show ="props.index==c_index || props.selected == true"							
 						></v-checkbox>
+					</td>
+					<td v-else class="justify-center" @click="props.selected = !props.selected" >
+						
 					</td>
 					<td v-if="props.item.icon =='folder'" @click="fetchData({'path':props.item.path, 'name':props.item.name})" class="text-xs-center pointer">{{ props.item.name }}</td>
 					<td v-else class="text-xs-center">{{ props.item.name }}</td>
 					<td class="text-xs-center">{{ findFilesize(props.item.size) }}</td>
 					<td class="text-xs-center">{{ findDate(props.item.lastModified) }}</td>
-					<td class="justify-center">
+					<td v-if="props.item.name!=''" class="justify-center">
 						<v-icon style="margin-right:10px;" v-if="props.item.icon=='insert_photo'" small @click="previewFile(props.item)" color="blue darken-2">visibility</v-icon>
 						<v-icon style="margin-right:10px;" v-if="props.item.icon!='insert_photo'" small color="grey">visibility_off</v-icon>
 						<v-icon small @click="removeFile(props.item)" color="red darken-2">delete_forever</v-icon>
+					</td>
+					<td v-else class="justify-center">
+						
 					</td>
 					</tr>
 				</template>
@@ -269,6 +275,8 @@ import moment from 'moment'
 import filesize from 'filesize'
 import { IntersectingCirclesSpinner } from 'epic-spinners'
 import { saveAs } from 'file-saver'
+import JSZip from "jszip";
+import JSZipUtils from "jszip-utils"
 import Services from '../components/services'
 export default {
 	mixins:[Services],
@@ -700,7 +708,7 @@ export default {
 		},
 		downloadFileCallBack(response){
 			var _this = this;
-			if (this.selected == 1){
+			if (this.selected.length == 1){
 				const url = window.URL.createObjectURL(new Blob([response.data]))
 				const link = document.createElement('a')
 				link.href = url
diff --git a/vue_app/src/views/Dashboard_layout.vue b/src/views/Dashboard_layout.vue
similarity index 100%
rename from vue_app/src/views/Dashboard_layout.vue
rename to src/views/Dashboard_layout.vue
diff --git a/vue_app/src/views/Functions.vue b/src/views/Functions.vue
similarity index 93%
rename from vue_app/src/views/Functions.vue
rename to src/views/Functions.vue
index 590462b..4e57c9d 100644
--- a/vue_app/src/views/Functions.vue
+++ b/src/views/Functions.vue
@@ -67,6 +67,17 @@
 									<v-card flat>
 										<v-card-text class="custom-padding xs6"> <strong>Name: </strong> {{props.item.service}}</v-card-text>
 										<v-card-text class="custom-padding"><strong>Image: </strong> {{props.item.container}}</v-card-text>
+										<v-card-text style="display:flex;margin-right: 5px;" class="custom-padding">
+											<strong style="padding-top: 12px;margin-right: 5px;">Token: </strong> 
+											<v-text-field style="width: 80%!important;padding-top: 0px!important;margin-top: 0px!important;"
+												:value="props.item.token"
+												:append-icon="show1 ? 'visibility' : 'visibility_off'"
+												:type="show1 ? 'text' : 'password'"
+												name="input-10-1"
+												@click:append="show1 = !show1"
+												readonly
+											></v-text-field>
+										</v-card-text>
 										<v-card-text class="custom-padding"><strong>Environment variables: </strong> 
 											<pre v-show="Object.keys(props.item.envVars.Variables).length!==0" id="json-renderer"></pre>
 										</v-card-text>
@@ -256,6 +267,7 @@ export default {
 		disable_form: true,
 		disable_storage: true,
 		params_delete: '', 
+		show1:false
 	}),
   	methods: {
 		showEnvVars(value){
@@ -285,17 +297,19 @@ export default {
 				editionMode: true,
 				name: this.services[index].service,
 				image: this.services[index].container,
+				token: this.services[index].token,
 				input: this.services[index].inputs,
 				output: this.services[index].outputs,
 				log_Level: this.services[index].logLevel,
 				envVars: this.services[index].envVars,
+				annotations: this.services[index].annotations?this.services[index].annotations:{},
+				labels: this.services[index].labels?this.services[index].labels:{},
 				cpu: this.services[index].cpu,
 				script: this.services[index].script,
 				memory: this.services[index].memory,
 				storage_provider: this.services[index].storage
 			
 			}
-			console.log(servInfo)
 			window.getApp.$emit('FUNC_OPEN_MANAGEMENT_DIALOG', servInfo)
 		},    
 		deleteFunction(serv, servName) {      
@@ -317,20 +331,21 @@ export default {
 			}
 		},
 		listServicesCallback(response) {
-			if(response.length > 0){
+			if(response.status == 200){
 				this.show_spinner = false;
-				this.services = Object.assign(this.services, response); 
-				this.services = response.map((serv) => {
+				this.services = Object.assign(this.services, response.data); 
+				this.services = response.data.map((serv) => {
 					return {
 						service: serv.name,
 						container: serv.image,
+						token: serv.token,
 						cpu: serv.cpu,
 						logLevel: serv.log_level,
 						envVars: serv.environment,
 						memory: serv.memory,
 						inputs: serv.input,
 						outputs: serv.output,
-						storage: serv.storage_provider,
+						storage: serv.storage_providers,
 						script: serv.script
 					}
 				})				
diff --git a/vue_app/src/views/Login.vue b/src/views/Login.vue
similarity index 94%
rename from vue_app/src/views/Login.vue
rename to src/views/Login.vue
index de6da8c..8f8012a 100644
--- a/vue_app/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -18,7 +18,7 @@
                 </v-form>
               </v-card-text>
               <v-card-actions>
-                <v-btn icon>
+                <!-- <v-btn icon>
                   <v-icon color="blue">fa fa-facebook-square fa-lg</v-icon>
                 </v-btn>
                 <v-btn icon>
@@ -26,9 +26,9 @@
                 </v-btn>
                 <v-btn icon>
                   <v-icon color="light-blue">fa fa-twitter fa-lg</v-icon>
-                </v-btn>
+                </v-btn> -->
                 <v-spacer></v-spacer>
-                <v-btn block color="teal" dark @click.native="login()" :loading="loading">Login</v-btn>
+                <v-btn color="teal" dark @click.native="login()" :loading="loading">Login</v-btn>
               </v-card-actions>
             </v-card>
           </v-flex>
@@ -53,6 +53,7 @@ export default {
     
   }),
   created(){
+    localStorage.clear();
     localStorage.setItem("authenticated", false);
   },
 
@@ -101,7 +102,7 @@ export default {
         var _this = this
           axios({
                 method: 'get',
-                url: this.api+'/system/config',
+                url: this.env.api+'/system/config',
                 auth: {
                     username: this.model.username,
                     password: this.model.password
diff --git a/vue_app/src/views/Logs.vue b/src/views/Logs.vue
similarity index 83%
rename from vue_app/src/views/Logs.vue
rename to src/views/Logs.vue
index 2fb9de6..6ea7f23 100644
--- a/vue_app/src/views/Logs.vue
+++ b/src/views/Logs.vue
@@ -1,9 +1,8 @@
 <template>
     <div class="mb-1">		
         <v-toolbar flat color="white">
+            <v-btn color="primary" icon  @click="goBack()"><v-icon>arrow_back</v-icon> </v-btn>
             <v-toolbar-title>LOGS: Service {{serviceName}} </v-toolbar-title>
-            <v-spacer></v-spacer>
-            <v-btn color="primary" dark @click="goBack()">BACK</v-btn>
         </v-toolbar>
         <v-card-title>
             <v-text-field
@@ -16,7 +15,7 @@
             <v-btn flat icon color="blue" @click="handleUpdate()">
                 <v-icon>autorenew</v-icon>
             </v-btn>
-             <v-btn color="green lighten-2" dark @click="deleteSuccessJobs()">DELETE SUCCESS JOBS</v-btn>          
+             <v-btn color="green lighten-2" dark @click="deleteSuccessJobs()">DELETE SUCCEEDED JOBS</v-btn>          
              <v-btn color="error" dark @click="deleteAllJobs()">DELETE ALL JOBS</v-btn>          
         </v-card-title>
         <v-data-table
@@ -35,15 +34,18 @@
             <tr >
                 <td>{{ props.item.name }}</td>
                 <td class="text-xs-center">{{ props.item.status }}</td>
-                <td class="text-xs-center">{{ moment(props.item.creation).format("YYYY-MM-DD HH:mm") }}</td>
-                <td class="text-xs-center">{{ moment(props.item.start).format("YYYY-MM-DD HH:mm") }}</td>
-                <td class="text-xs-center">{{ moment(props.item.finish).format("YYYY-MM-DD HH:mm") }}</td>
+                <td class="text-xs-center">{{ moment(props.item.creation).format("YYYY-MM-DD HH:mm:ss") }}</td>
+                <td class="text-xs-center" v-if="props.item.status!='Pending'">{{ moment(props.item.start).format("YYYY-MM-DD HH:mm:ss") }}</td>
+                <td class="text-xs-center" v-else></td>
+                <td class="text-xs-center" v-if="props.item.status!='Pending' && props.item.status!='Running'">{{ moment(props.item.finish).format("YYYY-MM-DD HH:mm:ss") }}</td>
+                <td class="text-xs-center" v-else></td>
                 <td class="text-xs-center">
+                    <v-icon small class="mr-2" @click="moreLogs(props.item.name);handleUpdate()">autorenew</v-icon>
                     <v-icon small class="mr-2" @click="deleteJob(props.item,props.item.name)">delete</v-icon>
                 </td>
                 <td class="justify-center layout px-0">
-                        <v-icon  medium v-show="props.expanded" @click="props.expanded = !props.expanded">expand_less</v-icon>
-                        <v-icon  medium v-show="!props.expanded" @click="props.expanded = !props.expanded;moreLogs(props.item.name)">expand_more</v-icon>
+                        <v-icon  medium v-show="props.expanded && props.item.status!='Pending'" @click="props.expanded = !props.expanded">expand_less</v-icon>
+                        <v-icon  medium v-show="!props.expanded && props.item.status!='Pending'" @click="props.expanded = !props.expanded;moreLogs(props.item.name)">expand_more</v-icon>
                 </td>
 
             </tr>
@@ -96,10 +98,10 @@ export default {
             
             value: 'name',
             },
-            { text: 'Status',align: 'center', value: 'status' },
-            { text: 'Creation Time', align: 'center', value: 'create_time' },
-            { text: 'Start time',align: 'center', value: 'start_time' },
-            { text: 'Finish Time',align: 'center', value: 'finish_time' },       
+            { text: 'STATUS',align: 'center', value: 'status' },
+            { text: 'CREATION TIME', align: 'center', value: 'create_time' },
+            { text: 'START TIME',align: 'center', value: 'start_time' },
+            { text: 'FINISH TIME',align: 'center', value: 'finish_time' },       
             { text: '',align: 'center', value: 'actions' },
             { text: '',align: 'center', value: 'expand' },
         ],
@@ -142,7 +144,12 @@ export default {
             this.listJobNameCall(params_logs, this.listJobNameCallback);
         },
         listJobNameCallback(response){
-                this.job_logs = response  //remember to handle error
+                this.job_logs = ''
+                if(response.status==200){
+                    this.job_logs = response.data  //remember to handle error
+                }else {
+                    this.job_logs = "There are no logs available."
+                }
         },
         goBack(){
             this.$router.push({name: "Functions"})
diff --git a/vue_app/src/views/Settings.vue b/src/views/Settings.vue
similarity index 100%
rename from vue_app/src/views/Settings.vue
rename to src/views/Settings.vue
diff --git a/vue_app/src/views/sys/Deny.vue b/src/views/sys/Deny.vue
similarity index 100%
rename from vue_app/src/views/sys/Deny.vue
rename to src/views/sys/Deny.vue
diff --git a/vue_app/src/views/sys/Error.vue b/src/views/sys/Error.vue
similarity index 100%
rename from vue_app/src/views/sys/Error.vue
rename to src/views/sys/Error.vue
diff --git a/vue_app/src/views/sys/NotFound.vue b/src/views/sys/NotFound.vue
similarity index 100%
rename from vue_app/src/views/sys/NotFound.vue
rename to src/views/sys/NotFound.vue
diff --git a/vue_app/tests/e2e/custom-assertions/elementCount.js b/tests/e2e/custom-assertions/elementCount.js
similarity index 100%
rename from vue_app/tests/e2e/custom-assertions/elementCount.js
rename to tests/e2e/custom-assertions/elementCount.js
diff --git a/vue_app/tests/e2e/specs/test.js b/tests/e2e/specs/test.js
similarity index 100%
rename from vue_app/tests/e2e/specs/test.js
rename to tests/e2e/specs/test.js
diff --git a/vue_app/tests/unit/.eslintrc.js b/tests/unit/.eslintrc.js
similarity index 100%
rename from vue_app/tests/unit/.eslintrc.js
rename to tests/unit/.eslintrc.js
diff --git a/vue_app/tests/unit/HelloWorld.spec.js b/tests/unit/HelloWorld.spec.js
similarity index 100%
rename from vue_app/tests/unit/HelloWorld.spec.js
rename to tests/unit/HelloWorld.spec.js
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..ab78804
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,4 @@
+// vue.config.js
+module.exports = {
+  publicPath: './',
+}
diff --git a/vue_app/LICENSE b/vue_app/LICENSE
deleted file mode 100644
index 261eeb9..0000000
--- a/vue_app/LICENSE
+++ /dev/null
@@ -1,201 +0,0 @@
-                                 Apache License
-                           Version 2.0, January 2004
-                        http://www.apache.org/licenses/
-
-   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
-
-   1. Definitions.
-
-      "License" shall mean the terms and conditions for use, reproduction,
-      and distribution as defined by Sections 1 through 9 of this document.
-
-      "Licensor" shall mean the copyright owner or entity authorized by
-      the copyright owner that is granting the License.
-
-      "Legal Entity" shall mean the union of the acting entity and all
-      other entities that control, are controlled by, or are under common
-      control with that entity. For the purposes of this definition,
-      "control" means (i) the power, direct or indirect, to cause the
-      direction or management of such entity, whether by contract or
-      otherwise, or (ii) ownership of fifty percent (50%) or more of the
-      outstanding shares, or (iii) beneficial ownership of such entity.
-
-      "You" (or "Your") shall mean an individual or Legal Entity
-      exercising permissions granted by this License.
-
-      "Source" form shall mean the preferred form for making modifications,
-      including but not limited to software source code, documentation
-      source, and configuration files.
-
-      "Object" form shall mean any form resulting from mechanical
-      transformation or translation of a Source form, including but
-      not limited to compiled object code, generated documentation,
-      and conversions to other media types.
-
-      "Work" shall mean the work of authorship, whether in Source or
-      Object form, made available under the License, as indicated by a
-      copyright notice that is included in or attached to the work
-      (an example is provided in the Appendix below).
-
-      "Derivative Works" shall mean any work, whether in Source or Object
-      form, that is based on (or derived from) the Work and for which the
-      editorial revisions, annotations, elaborations, or other modifications
-      represent, as a whole, an original work of authorship. For the purposes
-      of this License, Derivative Works shall not include works that remain
-      separable from, or merely link (or bind by name) to the interfaces of,
-      the Work and Derivative Works thereof.
-
-      "Contribution" shall mean any work of authorship, including
-      the original version of the Work and any modifications or additions
-      to that Work or Derivative Works thereof, that is intentionally
-      submitted to Licensor for inclusion in the Work by the copyright owner
-      or by an individual or Legal Entity authorized to submit on behalf of
-      the copyright owner. For the purposes of this definition, "submitted"
-      means any form of electronic, verbal, or written communication sent
-      to the Licensor or its representatives, including but not limited to
-      communication on electronic mailing lists, source code control systems,
-      and issue tracking systems that are managed by, or on behalf of, the
-      Licensor for the purpose of discussing and improving the Work, but
-      excluding communication that is conspicuously marked or otherwise
-      designated in writing by the copyright owner as "Not a Contribution."
-
-      "Contributor" shall mean Licensor and any individual or Legal Entity
-      on behalf of whom a Contribution has been received by Licensor and
-      subsequently incorporated within the Work.
-
-   2. Grant of Copyright License. Subject to the terms and conditions of
-      this License, each Contributor hereby grants to You a perpetual,
-      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
-      copyright license to reproduce, prepare Derivative Works of,
-      publicly display, publicly perform, sublicense, and distribute the
-      Work and such Derivative Works in Source or Object form.
-
-   3. Grant of Patent License. Subject to the terms and conditions of
-      this License, each Contributor hereby grants to You a perpetual,
-      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
-      (except as stated in this section) patent license to make, have made,
-      use, offer to sell, sell, import, and otherwise transfer the Work,
-      where such license applies only to those patent claims licensable
-      by such Contributor that are necessarily infringed by their
-      Contribution(s) alone or by combination of their Contribution(s)
-      with the Work to which such Contribution(s) was submitted. If You
-      institute patent litigation against any entity (including a
-      cross-claim or counterclaim in a lawsuit) alleging that the Work
-      or a Contribution incorporated within the Work constitutes direct
-      or contributory patent infringement, then any patent licenses
-      granted to You under this License for that Work shall terminate
-      as of the date such litigation is filed.
-
-   4. Redistribution. You may reproduce and distribute copies of the
-      Work or Derivative Works thereof in any medium, with or without
-      modifications, and in Source or Object form, provided that You
-      meet the following conditions:
-
-      (a) You must give any other recipients of the Work or
-          Derivative Works a copy of this License; and
-
-      (b) You must cause any modified files to carry prominent notices
-          stating that You changed the files; and
-
-      (c) You must retain, in the Source form of any Derivative Works
-          that You distribute, all copyright, patent, trademark, and
-          attribution notices from the Source form of the Work,
-          excluding those notices that do not pertain to any part of
-          the Derivative Works; and
-
-      (d) If the Work includes a "NOTICE" text file as part of its
-          distribution, then any Derivative Works that You distribute must
-          include a readable copy of the attribution notices contained
-          within such NOTICE file, excluding those notices that do not
-          pertain to any part of the Derivative Works, in at least one
-          of the following places: within a NOTICE text file distributed
-          as part of the Derivative Works; within the Source form or
-          documentation, if provided along with the Derivative Works; or,
-          within a display generated by the Derivative Works, if and
-          wherever such third-party notices normally appear. The contents
-          of the NOTICE file are for informational purposes only and
-          do not modify the License. You may add Your own attribution
-          notices within Derivative Works that You distribute, alongside
-          or as an addendum to the NOTICE text from the Work, provided
-          that such additional attribution notices cannot be construed
-          as modifying the License.
-
-      You may add Your own copyright statement to Your modifications and
-      may provide additional or different license terms and conditions
-      for use, reproduction, or distribution of Your modifications, or
-      for any such Derivative Works as a whole, provided Your use,
-      reproduction, and distribution of the Work otherwise complies with
-      the conditions stated in this License.
-
-   5. Submission of Contributions. Unless You explicitly state otherwise,
-      any Contribution intentionally submitted for inclusion in the Work
-      by You to the Licensor shall be under the terms and conditions of
-      this License, without any additional terms or conditions.
-      Notwithstanding the above, nothing herein shall supersede or modify
-      the terms of any separate license agreement you may have executed
-      with Licensor regarding such Contributions.
-
-   6. Trademarks. This License does not grant permission to use the trade
-      names, trademarks, service marks, or product names of the Licensor,
-      except as required for reasonable and customary use in describing the
-      origin of the Work and reproducing the content of the NOTICE file.
-
-   7. Disclaimer of Warranty. Unless required by applicable law or
-      agreed to in writing, Licensor provides the Work (and each
-      Contributor provides its Contributions) on an "AS IS" BASIS,
-      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
-      implied, including, without limitation, any warranties or conditions
-      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
-      PARTICULAR PURPOSE. You are solely responsible for determining the
-      appropriateness of using or redistributing the Work and assume any
-      risks associated with Your exercise of permissions under this License.
-
-   8. Limitation of Liability. In no event and under no legal theory,
-      whether in tort (including negligence), contract, or otherwise,
-      unless required by applicable law (such as deliberate and grossly
-      negligent acts) or agreed to in writing, shall any Contributor be
-      liable to You for damages, including any direct, indirect, special,
-      incidental, or consequential damages of any character arising as a
-      result of this License or out of the use or inability to use the
-      Work (including but not limited to damages for loss of goodwill,
-      work stoppage, computer failure or malfunction, or any and all
-      other commercial damages or losses), even if such Contributor
-      has been advised of the possibility of such damages.
-
-   9. Accepting Warranty or Additional Liability. While redistributing
-      the Work or Derivative Works thereof, You may choose to offer,
-      and charge a fee for, acceptance of support, warranty, indemnity,
-      or other liability obligations and/or rights consistent with this
-      License. However, in accepting such obligations, You may act only
-      on Your own behalf and on Your sole responsibility, not on behalf
-      of any other Contributor, and only if You agree to indemnify,
-      defend, and hold each Contributor harmless for any liability
-      incurred by, or claims asserted against, such Contributor by reason
-      of your accepting any such warranty or additional liability.
-
-   END OF TERMS AND CONDITIONS
-
-   APPENDIX: How to apply the Apache License to your work.
-
-      To apply the Apache License to your work, attach the following
-      boilerplate notice, with the fields enclosed by brackets "[]"
-      replaced with your own identifying information. (Don't include
-      the brackets!)  The text should be enclosed in the appropriate
-      comment syntax for the file format. We also recommend that a
-      file or class name and description of purpose be included on the
-      same "printed page" as the copyright notice for easier
-      identification within third-party archives.
-
-   Copyright [yyyy] [name of copyright owner]
-
-   Licensed under the Apache License, Version 2.0 (the "License");
-   you may not use this file except in compliance with the License.
-   You may obtain a copy of the License at
-
-       http://www.apache.org/licenses/LICENSE-2.0
-
-   Unless required by applicable law or agreed to in writing, software
-   distributed under the License is distributed on an "AS IS" BASIS,
-   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-   See the License for the specific language governing permissions and
-   limitations under the License.
diff --git a/vue_app/README.md b/vue_app/README.md
deleted file mode 100644
index 934796e..0000000
--- a/vue_app/README.md
+++ /dev/null
@@ -1,31 +0,0 @@
-# oscar-ui
-
-## Project setup
-```
-npm install
-```
-
-### Compiles and hot-reloads for development
-```
-npm run serve
-```
-
-### Compiles and minifies for production
-```
-npm run build
-```
-
-### Lints and fixes files
-```
-npm run lint
-```
-
-### Run your unit tests
-```
-npm run test:unit
-```
-
-### Run your end-to-end tests
-```
-npm run test:e2e
-```
diff --git a/vue_app/src/components/forms/FunctionForm.vue b/vue_app/src/components/forms/FunctionForm.vue
deleted file mode 100644
index a950a50..0000000
--- a/vue_app/src/components/forms/FunctionForm.vue
+++ /dev/null
@@ -1,1544 +0,0 @@
-<template>
-	<v-layout row wrap justify-end>    
-		<v-btn flat icon color="blue" @click="handleUpdate()">
-      		<v-icon>autorenew</v-icon>
-    	</v-btn>
-		<v-dialog id="vdiag" lazy v-model="dialog" persistent :fullscreen="$vuetify.breakpoint.xs" max-width="50%">
-			<v-btn slot="activator" color="teal" dark class="mb-2">
-				<v-icon left>add_box</v-icon>
-				Deploy New Service
-			</v-btn>
-			<v-card >
-				<v-form ref="form" v-model="form.valid" lazy-validation>
-					<v-toolbar flat :color="formColor" class="white--text" style="margin-bottom:10px;">
-						<span class="headline" style="width:100%;text-align:center">{{ formTitle }}</span>
-					</v-toolbar>
-					
-					<ul class="nav nav-pills nav-fill" id="myTab" role="tablist" style="padding-right:5px; padding-left:5px;">
-						<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
-							<a class="nav-link active" id="home-tab" @click="show('home')" role="tab" aria-controls="home" aria-selected="true">New Function</a>
-						</li>
-						<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
-							<a class="nav-link " id="input_output-tab" @click="show('input_output')" role="tab" aria-controls="input_output" aria-selected="false">Input/Output</a>
-						</li>
-						<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
-							<a class="nav-link" id="profile-tab" @click="show('profile')" role="tab" aria-controls="profile" aria-selected="false">Storage</a>
-						</li>  
-					</ul>
-					 
-					<v-progress-linear :active="progress.active" :indeterminate="true"></v-progress-linear>
-					 
-					<div class="tab-content" id="myTabContent">
-						<div class="tab-pane tab-pane-content fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
-							<v-card-text>
-									<v-layout wrap>
-										<div style="width:100%;padding: 0px 10px;">
-											<v-flex xs12>
-												<v-text-field
-													v-model="form.image"
-													:rules="form.imageRules"
-													:counter="200"
-													label="Docker image:"
-													required
-												></v-text-field>
-											</v-flex>
-
-											<v-flex xs12>
-												<v-text-field
-													v-model="form.name"
-													:rules="form.nameRules"
-													:counter="200"
-													label="Function name"
-													required
-													:disabled="this.editionMode"
-												></v-text-field>
-											</v-flex>               
-										</div>
-										<div class="row" style="width:100%;padding: 0px 10px;"> 	
-											<v-flex xs12  md5 text-xs-center>
-												<v-btn color="primary" class="white--text" @click.native="addFiles()"> Select a file<v-icon right dark>note_add</v-icon></v-btn>
-											</v-flex>
-
-											<v-flex xs12  md2 class="text-xs-center">
-												<v-chip>or</v-chip>
-											</v-flex>
-
-											<v-flex xs12  md5>
-												<div style="margin:10px" class="form-group">                     
-												<div class="input-group">
-													<input type="text" class="form-control" id="bucketname" v-model="url"   placeholder="URL" autofocus  style="border-right: none; border-left:none; border-top:none; hover: "/>                     
-													
-													<div class="input-group-append mr-2">                        
-													<button class="" @click="readurl()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-													<button class="" @click="cleanfield()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-													</div>
-												</div>            
-												</div> 
-											</v-flex>
-
-											<v-flex xs12 text-xs-center>
-												<span v-show="filerequire" style="color: #cc3300; font-size: 12px;"><b>Select a file or enter a URL</b></span>                   									
-											</v-flex>
-
-											
-											<v-flex xs12 sm8 offset-sm2 v-show="showSelectedFiles"  id="selectedList" class="text-xs-center">
-													<input type="file" id="files" ref="files" hidden=true  v-on:change="handleFilesUpload()"/>								                  									
-													<v-list subheader dense >
-														<v-subheader inset>File</v-subheader>
-														<v-list-tile
-														v-for="(file, key) in files"
-														:key="key"
-														avatar
-														@click.stop=""
-														>                                    
-																<v-progress-circular
-																indeterminate
-																color="teal"
-																v-show="showUploading"
-																>
-																</v-progress-circular>
-
-																<v-list-tile-content>
-																	<v-list-tile-title>{{ filename }}</v-list-tile-title>														
-																</v-list-tile-content>
-
-																<v-list-tile-action>
-																	<v-btn icon ripple @click="removeFile(key)">
-																	<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																	</v-btn>
-																</v-list-tile-action>
-														</v-list-tile>
-													</v-list>
-													<v-card flat>
-														<v-card-actions >
-														<v-btn
-															outline color="indigo"
-															round
-															small
-															@click.native="editSummernote()"
-														>
-															Edit															
-														</v-btn>
-														<v-btn
-															outline color="indigo"
-															round
-															small
-															@click.native="saveSummernote()"
-														>
-															Save															
-														</v-btn>
-														</v-card-actions>
-														<v-card-actions>
-														
-														</v-card-actions>
-													</v-card>
-											</v-flex>	
-											<v-flex xs-12 text-center v-show="editionMode==true && showSelectedFiles == false">
-												<span>Note: To edit the script sending in the creation of the service press the Edit button.</span>
-												<v-card flat>
-														<v-card-actions style="justify-content: center;">
-														<v-btn
-															outline color="indigo"
-															round
-															small
-															@click.native="editSummernote()"
-														>
-															Edit															
-														</v-btn>
-														<v-btn
-															outline color="indigo"
-															round
-															small
-															@click.native="saveSummernote()"
-														>
-															Save															
-														</v-btn>
-														</v-card-actions>
-													</v-card>
-											</v-flex>
-											<v-flex xs12>
-                                            	<!-- <div  v-show="editScript==true" style="white-space: pre-wrap;" class="click2edit text-left"></div>				 -->
-												<div class="summernote" style="white-space: pre-wrap;"></div>
-                                            	<!-- <div v-show="editScript==true" style="white-space: pre-wrap;" class="click2edit text-left"></div>				 -->
-											</v-flex>
-									
-											<v-flex xs12>
-													<v-btn
-													outline color="indigo"
-													round
-													small
-													@click.native="collapse()"
-												>
-													More Options
-													<v-icon right dark>{{expand}}</v-icon>
-												</v-btn>                    
-											</v-flex>
-										</div>
-									
-										<v-flex xs12 id="panel">  								
-											<v-container>
-												<v-layout row wrap>
-													<div class="form-group" style="width:100%">                     
-													<div class="input-group">
-														<v-flex xs12 sm5>
-															<v-text-field
-																v-model="form.envVarskey"
-																:counter="200"
-																label="Environment variables (key)"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>	
-														<v-flex xs10 sm5>
-															<v-text-field
-																v-model="form.envVarsValue"
-																:counter="200"
-																label="Environment variables (value)"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>	
-														
-														<v-flex xs2 sm2 style="padding-top:20px;" >
-															<div  class="input-group-append mr-2">  														                    
-																<button class="" @click="includeEnv()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-																<button class="" @click="cleanfieldenv()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-															</div>
-														</v-flex>
-													</div>            
-													</div> 
-												</v-layout>
-
-												<v-flex xs12 sm6 offset-sm3 v-show="showselectEnv">
-													<input type="file" id="envs" hidden="true" multiple />
-													<v-list subheader dense>
-														<v-subheader inset>Env Vars</v-subheader>
-														<v-list-tile
-														v-for="(enVar,key) in envVars"
-														:key="key"
-														avatar
-														@click.stop=""
-														>       
-
-																<v-list-tile-content>
-																	<v-list-tile-title>{{key}}:{{envVars[key]}}</v-list-tile-title>
-																</v-list-tile-content>
-
-																<v-list-tile-action>
-																	<v-btn icon ripple @click="removeEnv(key)">
-																	<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																	</v-btn>
-																</v-list-tile-action>
-														</v-list-tile>
-													</v-list>
-												</v-flex>
-												
-												<v-layout row wrap>
-													<v-flex xs12 sm5>
-														<v-text-field
-															v-model="form.limits_cpu"
-															:counter="10"
-															label="CPU"
-															style="padding-right: 5px;"											
-														></v-text-field>											
-													</v-flex>
-
-													<v-flex xs10 sm5>
-														<v-text-field
-															v-model="form.limits_memory"
-															:counter="10"
-															label="Memory"
-															style="padding-right: 5px;"																											
-														></v-text-field>																						
-													</v-flex>  
-													<v-flex xs2 sm2 style="padding-top:10px;">
-														<select id="classmemory" class="custom-select" >																										
-															<option selected value="1">Mi</option>
-															<option value="2">Gi</option>															
-														</select>
-													</v-flex>	
-
-													<v-flex xs12 sm3 style="padding-top:10px;">
-														<v-select
-															:items="form.log_level"
-															label="LOG LEVEL"
-															v-model="select_logLevel"
-														></v-select>
-													</v-flex>	
-													
-												</v-layout>
-											</v-container>								
-										</v-flex> 						
-									</v-layout>
-							</v-card-text>
-							<v-card-actions >
-								<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
-								<v-btn @click="clear" flat color="red">Clear</v-btn>
-								<v-spacer></v-spacer>
-								<v-btn @click="show('input_output')" flat color="success">NEXT</v-btn>
-							</v-card-actions>
-						</div>
-
-						<div class="tab-pane tab-pane-content fade" id="input_output" role="tabpanel" aria-labelledby="input_output-tab" style="padding-right:3rem; padding-left:3rem;">
-							
-							<ul class="nav nav-pills nav-fill" id="myTabInOut" role="tablist" style="padding-right:5px; padding-left:5px;">
-								<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
-									<a class="nav-link active" id="input-tab" @click="show_input('input')" role="tab" aria-controls="home" aria-selected="true">INPUTS</a>
-								</li>
-								<li class="nav-item" style="margin-rigth:10px;margin-left:10px;">
-									<a class="nav-link" id="output-tab" @click="show_input('output')" role="tab" aria-controls="input_output" aria-selected="false">OUTPUTS</a>
-								</li>
-							</ul>
-
-							<div class="tab-content" id="myTabContentInOut">
-								<div class="tab-pane tab-pane-inout fade show active"  id="input" role="tabpanel" aria-labelledby="input-tab" style="padding-right:3rem; padding-left:3rem;">
-										<v-layout row wrap>
-											<v-flex xs12>  								
-												<v-container>
-													<div class="form-group" style="width:100%">                     
-														<div class="input-group">
-															<v-flex>
-																<v-text-field
-																	v-model="form.path_in"
-																	:counter="200"
-																	label="Path"		
-																	style="padding-right: 5px;"									
-																></v-text-field>
-															</v-flex>	
-															<v-flex>
-																<v-text-field
-																	v-model="form.storage_provider_in"
-																	:counter="200"
-																	label="Storage Provider"		
-																	style="padding-right: 5px;"									
-																></v-text-field>
-															</v-flex>
-														</div>            
-													</div> 
-
-													<div class="form-group" style="width:100%">                     
-														<div class="input-group">
-															<v-flex>
-																<v-text-field
-																	v-model="form.prefix_in"
-																	:counter="200"
-																	label="Prefix"		
-																	style="padding-right: 5px;"									
-																></v-text-field>
-															</v-flex>	
-
-															<div  class="input-group-append mr-2">  														                    
-																<button class="" @click="includePrefixIn()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-																<button class="" @click="cleanfieldPrefixIn()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-															</div>
-														</div>            
-													</div> 
-
-													<v-flex xs12 sm6 offset-sm3 v-show="showselectPrefixIn">
-														<input type="file" id="prefixs" hidden="true" multiple />
-														<v-list subheader dense>
-															<v-subheader inset>Prefixs</v-subheader>
-															<v-list-tile
-															v-for="(prefix,key) in prefixs_in"
-															:key="key"
-															avatar
-															@click.stop=""
-															>                                    
-																	
-
-																	<v-list-tile-content>
-																		<v-list-tile-title>{{prefix}}</v-list-tile-title>
-																	</v-list-tile-content>
-
-																	<v-list-tile-action>
-																		<v-btn icon ripple @click="removePrefixIn(key)">
-																		<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																		</v-btn>
-																	</v-list-tile-action>
-															</v-list-tile>
-														</v-list>
-													</v-flex>
-
-
-
-													<div class="form-group" style="width:100%">                     
-														<div class="input-group">
-															<v-flex>
-																<v-text-field
-																	v-model="form.suffix_in"
-																	:counter="200"
-																	label="Suffix"		
-																	style="padding-right: 5px;"									
-																></v-text-field>
-															</v-flex>	
-															<div  class="input-group-append mr-2">  														                    
-																<button class="" @click="includeSuffixIn()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-																<button class="" @click="cleanfieldSuffixIn()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-															</div>
-														</div>            
-													</div> 
-
-													<v-flex xs12 sm6 offset-sm3 v-show="showselectSuffixIn">
-														<input type="file" id="suffix" hidden="true" multiple />
-														<v-list subheader dense>
-															<v-subheader inset>Suffixs</v-subheader>
-															<v-list-tile
-															v-for="(suffix,key) in suffixs_in"
-															:key="key"
-															avatar
-															@click.stop=""
-															>                                    
-
-																<v-list-tile-content>
-																	<v-list-tile-title>{{suffix}}</v-list-tile-title>
-																</v-list-tile-content>
-
-																<v-list-tile-action>
-																	<v-btn icon ripple @click="removeSuffixIn(key)">
-																	<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																	</v-btn>
-																</v-list-tile-action>
-															</v-list-tile>
-														</v-list>
-													</v-flex>
-												</v-container>
-											</v-flex>	
-										</v-layout>
-
-										<v-flex xs12 v-show="showselectInput">
-											<input type="file" id="inputs" hidden="true" multiple />
-											<v-list subheader dense three-line>
-												<v-subheader inset>Inputs</v-subheader>
-												<v-list-tile
-												v-for="(input,key) in inputs"
-												:key="key"
-												avatar
-												@click.stop=""
-												style="margin-bottom:10px;"
-												>                                    
-														<v-list-tile-content>
-															<v-list-tile-title style="padding-bottom:20px;">Path: {{input.path}}</v-list-tile-title>
-															<v-list-tile-title style="padding-bottom:20px;">Storage_provider: {{input.storage_provider}}</v-list-tile-title>
-															<v-list-tile-title style="padding-bottom:20px;">Prefix: {{input.prefix}}</v-list-tile-title>
-															<v-list-tile-title style="padding-bottom:25px;">Suffix: {{input.suffix}}</v-list-tile-title> 
-														</v-list-tile-content>
-
-														<v-list-tile-action>
-															<v-btn icon ripple @click="removeInput(key)">
-															<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-															</v-btn>
-														</v-list-tile-action>
-												</v-list-tile>
-											</v-list>
-										</v-flex>
-
-										<v-card-actions class="text-md-center" >
-											<v-spacer></v-spacer>
-											<v-btn @click="includeInput()"  color="info">ADD INPUT</v-btn>
-											
-										</v-card-actions>
-								</div>
-
-								<div class="tab-pane tab-pane-inout fade"  id="output" role="tabpanel" aria-labelledby="output-tab" style="padding-right:3rem; padding-left:3rem;">
-									<v-layout row wrap>
-										<v-flex xs12>  								
-											<v-container>
-												<div class="form-group" style="width:100%">                     
-													<div class="input-group">
-														<v-flex>
-															<v-text-field
-																v-model="form.path_out"
-																:counter="200"
-																label="Path"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>	
-														<v-flex>
-															<v-text-field
-																v-model="form.storage_provider_out"
-																:counter="200"
-																label="Storage Provider"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>
-													</div>            
-												</div> 
-
-												<div class="form-group" style="width:100%">                     
-													<div class="input-group">
-														<v-flex>
-															<v-text-field
-																v-model="form.prefix_out"
-																:counter="200"
-																label="Prefix"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>	
-
-														<div  class="input-group-append mr-2">  														                    
-															<button class="" @click="includePrefixOut()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-															<button class="" @click="cleanfieldPrefixOut()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-														</div>
-													</div>            
-												</div> 
-
-												<v-flex xs12 sm6 offset-sm3 v-show="showselectPrefixOut">
-													<input type="file" id="prefixs" hidden="true" multiple />
-													<v-list subheader dense>
-														<v-subheader inset>Prefixs</v-subheader>
-														<v-list-tile
-														v-for="(prefix,key) in prefixs_out"
-														:key="key"
-														avatar
-														@click.stop=""
-														>                                    
-																
-
-																<v-list-tile-content>
-																	<v-list-tile-title>{{prefix}}</v-list-tile-title>
-																</v-list-tile-content>
-
-																<v-list-tile-action>
-																	<v-btn icon ripple @click="removePrefixOut(key)">
-																	<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																	</v-btn>
-																</v-list-tile-action>
-														</v-list-tile>
-													</v-list>
-												</v-flex>
-
-
-
-												<div class="form-group" style="width:100%">                     
-													<div class="input-group">
-														<v-flex>
-															<v-text-field
-																v-model="form.suffix_out"
-																:counter="200"
-																label="Suffix"		
-																style="padding-right: 5px;"									
-															></v-text-field>
-														</v-flex>	
-														<div  class="input-group-append mr-2">  														                    
-															<button class="" @click="includeSuffixOut()" type="button"><v-icon left color="green">check_circle</v-icon></button>
-															<button class="" @click="cleanfieldSuffixOut()" type="button" ><v-icon left color="red">cancel</v-icon></button>                        
-														</div>
-													</div>            
-												</div> 
-
-
-
-												<v-flex xs12 sm6 offset-sm3 v-show="showselectSuffixOut">
-													<input type="file" id="suffix" hidden="true" multiple />
-													<v-list subheader dense>
-														<v-subheader inset>Suffixs</v-subheader>
-														<v-list-tile
-														v-for="(suffix,key) in suffixs_out"
-														:key="key"
-														avatar
-														@click.stop=""
-														>                                    
-
-															<v-list-tile-content>
-																<v-list-tile-title>{{suffix}}</v-list-tile-title>
-															</v-list-tile-content>
-
-															<v-list-tile-action>
-																<v-btn icon ripple @click="removeSuffixOut(key)">
-																<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-																</v-btn>
-															</v-list-tile-action>
-														</v-list-tile>
-													</v-list>
-												</v-flex>
-											</v-container>
-										</v-flex>	
-									</v-layout>
-
-									<v-flex xs12 v-show="showselectOutput">
-										<input type="file" id="inputs" hidden="true" multiple />
-										<v-list subheader dense three-line>
-											<v-subheader inset>Outputs</v-subheader>
-											<v-list-tile
-											v-for="(output,key) in outputs"
-											:key="key"
-											avatar
-											@click.stop=""
-											style="margin-bottom:10px;"
-											>                                    
-													<v-list-tile-content>
-														<v-list-tile-title style="padding-bottom:20px;">Path: {{output.path}}</v-list-tile-title>
-														<v-list-tile-title style="padding-bottom:20px;">Storage_provider: {{output.storage_provider}}</v-list-tile-title>
-														<v-list-tile-title style="padding-bottom:20px;">Prefix: {{output.prefix}}</v-list-tile-title>
-														<v-list-tile-title style="padding-bottom:25px;">Suffix: {{output.suffix}}</v-list-tile-title> 
-													</v-list-tile-content>
-
-													<v-list-tile-action>
-														<v-btn icon ripple @click="removeOutput(key)">
-														<v-icon color="red lighten-1">remove_circle_outline</v-icon>
-														</v-btn>
-													</v-list-tile-action>
-											</v-list-tile>
-										</v-list>
-									</v-flex>
-
-									<v-card-actions class="text-md-center" >
-										<v-spacer></v-spacer>
-										<v-btn @click="includeOutput()"  color="info">ADD OUTPUT</v-btn>
-									</v-card-actions>
-								</div>
-								<v-card-actions >
-									<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
-									<v-btn @click="cleanfieldInput();cleanfieldOutput()" flat color="red">Clear</v-btn>
-									<v-spacer></v-spacer>
-									<v-btn @click="show('home')" flat color="blue">BACK</v-btn>
-									<v-btn @click="show('profile')" flat color="success">NEXT</v-btn>
-								</v-card-actions>
-							</div>		
-									
-						</div>
-
-						<div class="tab-pane tab-pane-content fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
-
-							<div class=" div-list-content" >
-								<v-card style="padding:0 2rem 2rem 2rem;">
-
-									<v-tabs
-										fixed-tabs
-										v-model="model_create"
-										centered
-									>
-										<v-tab
-										:href="`#tab-minio`"
-										>
-											MINIO
-										</v-tab>
-										<v-tab
-										:href="`#tab-onedata`"
-										>
-											ONE DATA
-										</v-tab>
-										<v-tab
-										:href="`#tab-s3`"
-										>
-											S3
-										</v-tab>
-									</v-tabs>
-
-									<v-tabs-items v-model="model_create" >
-										<v-tab-item  :value="`tab-onedata`">
-											<v-container>
-									
-												<v-layout row style="padding:0px,10px;justify-content: center;">										
-													<img src="../../img/logo_one_data.jpg" alt=""> 
-												</v-layout>
-												<br>
-												<br>
-
-												<v-layout row style="padding:0px,10px;" >										
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field
-															v-model="onedata.oneprovider_host"
-															:counter="200"		
-															label="ONEPROVIDER HOST:"																
-														></v-text-field>
-													</v-flex>									
-												</v-layout>
-
-												<v-flex xs12 text-xs-center>
-													<span v-show="envrequirehost" style="color: #cc3300; font-size: 12px;"><b>ONEPROVIDER HOST is required</b></span>                   									
-												</v-flex>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="onedata.token"
-															:append-icon="showOneDataToken ? 'visibility_off' : 'visibility'"
-															:type="showOneDataToken ? 'text' : 'password'"
-															:counter="200"
-															label="ACCESS TOKEN:"
-															@click:append="showOneDataToken = !showOneDataToken"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-flex xs12 text-xs-center>
-													<span v-show="envrequiretoken" style="color: #cc3300; font-size: 12px;"><b>ACCESS TOKEN is required</b></span>                   									
-												</v-flex>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="onedata.space"
-															:counter="200"
-															label="SPACE:"
-														></v-text-field>
-													</v-flex>										
-												</v-layout>
-											</v-container>	
-										</v-tab-item>
-
-										<v-tab-item  :value="`tab-minio`">
-											<v-container>
-									
-												<v-layout row style="padding:0px,10px;justify-content: center;">										
-													<img src="../../img/minio-storage.png" height="110px" alt=""> 
-												</v-layout>
-												<br>
-												<br>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="minio.endpoint"
-															:counter="200"
-															label="ENDPOINT"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="minio.region"
-															:counter="200"
-															label="REGION"
-														></v-text-field>
-													</v-flex>										
-												</v-layout>
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="minio.secret_key"
-															:append-icon="showMinioSecretKey ? 'visibility_off' : 'visibility'"
-															:type="showMinioSecretKey ? 'text' : 'password'"
-															:counter="200"
-															label="SECRET KEY"
-															@click:append="showMinioSecretKey = !showMinioSecretKey"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="minio.access_key"
-															:append-icon="showMinioAccessKey ? 'visibility_off' : 'visibility'"
-															:type="showMinioAccessKey ? 'text' : 'password'"
-															:counter="200"
-															label="ACCESS KEY"
-															@click:append="showMinioAccessKey = !showMinioAccessKey"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex row xs12 sm8 offset-sm2>
-															<span style="margin-top:16px;padding-top:4px;color:#605C5C;padding-right:10px;">VERIFY</span>
-															<v-switch
-																v-model="minio.verify"
-															></v-switch>
-													</v-flex>										
-												</v-layout>
-											</v-container>
-										</v-tab-item>
-
-										<v-tab-item  :value="`tab-s3`">
-											<v-container>
-									
-												<v-layout row style="padding:0px,10px;justify-content: center;">										
-													<img src="../../img/amazon-s3.png" height="110px" alt=""> 
-												</v-layout>
-												<br>
-												<br>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="s3.access_key"
-															:append-icon="showS3AccessKey ? 'visibility_off' : 'visibility'"
-															:type="showS3AccessKey ? 'text' : 'password'"
-															:counter="200"
-															label="ACCESS KEY"
-															@click:append="showS3AccessKey = !showS3AccessKey"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="s3.secret_key"
-															:append-icon="showS3SecretKey ? 'visibility_off' : 'visibility'"
-															:type="showS3SecretKey ? 'text' : 'password'"
-															:counter="200"
-															label="SECRET KEY"
-															@click:append="showS3SecretKey = !showS3SecretKey"
-														></v-text-field>
-													</v-flex>
-												</v-layout>
-
-												<v-flex xs12 text-xs-center>
-													<span v-show="envrequiretoken" style="color: #cc3300; font-size: 12px;"><b>ACCESS TOKEN is required</b></span>                   									
-												</v-flex>
-
-												<v-layout row style="padding:0px,10px;">
-													<v-flex xs12 sm8 offset-sm2>
-														<v-text-field 
-															v-model="s3.region"
-															:counter="200"
-															label="REGION"
-														></v-text-field>
-													</v-flex>										
-												</v-layout>
-											</v-container>
-										</v-tab-item>
-									</v-tabs-items>	
-								</v-card>
-							</div>
-							<v-card-actions >
-								<v-btn @click="closeWithoutSave()" flat color="grey">Cancel</v-btn>
-								<v-btn @click="clear" flat color="red">Clear</v-btn>
-								<v-spacer></v-spacer>
-								<v-btn  @click="show('input_output')" flat color="primary">BACK</v-btn>
-								<v-btn :disabled="!form.valid" @click="submit" flat color="success">submit</v-btn>
-							</v-card-actions>						
-						</div>  
-					</div>									
-				</v-form>			
-			</v-card>			
-		</v-dialog>    
-	</v-layout>
-</template>
-
-<script>
-import axios from 'axios'
-import Services from '../../components/services';
-/* eslint-disable */
-export default {   
-	mixins:[Services],
-	name: 'FunctionForm',
-	data () {
-		return {			
-			dialog: false,        
-			drawer: false,    
-			url: "", 
-			allText: "", 
-			expand: "expand_more",
-			editionMode: false,
-			base64String : "",    
-			filename: "",  
-			files: [],    
-			inputs:[],  
-			prefixs_in:[],  
-			suffixs_in:[],  
-			outputs:[],  
-			prefixs_out:[],  
-			suffixs_out:[],  
-			showUploading: false,
-			showselectEnv: false,
-			showselectInput: false,
-			showselectPrefixIn: false,
-			showselectSuffixIn: false,
-			showselectOutput: false,
-			showselectPrefixOut: false,
-			showselectSuffixOut: false,
-			showselectAnn: false,
-			showOneDataToken: false,
-			showS3AccessKey: false,
-			showS3SecretKey: false,
-			showMinioAccessKey: false,
-			showMinioSecretKey: false,
-			filerequire : false,
-			envrequirehost: false,
-			envrequiretoken : false,
-			envrequirespace : false,
-			envVars:{},
-			envVarsAll:{},
-			limits_mem: '',
-			request_mem: '',
-			select_logLevel: 'INFO',
-			 minio:{
-				endpoint: '' ,
-				region: '',
-				secret_key: '',
-				access_key: '',
-				verify: true
-			},
-			s3:{
-				access_key: '',
-				secret_key: '',
-				region: ''
-			},
-			onedata:{
-				oneprovider_host: '',		
-				token: '',		
-				space: ''
-			},
-
-			form: {
-				valid: false,
-				image: '',
-				imageRules: [
-				v => !!v || 'Docker image is required',
-				// v => (v && v.includes('/')) || 'The Docker image must comply with the nomenclature of Docker Hub images'
-				// && /.+:.+/.test(v)
-				],
-				name: '',
-				nameRules: [
-				v => !!v || 'Function name is required'
-				],
-				envVarskey: "",
-				envVarsValue: "",	
-				path_in:"",
-				log_level:['CRITICAL','ERROR','WARNING','INFO','DEBUG','NOTSET'],
-				storage_provider_in:"",
-				prefix_in:"",
-				suffix_in:"",
-				path_out:"",
-				storage_provider_out:"",
-				prefix_out:"",
-				suffix_out:"",
-				storage_provider:{
-					// s3:{
-					// 	access_key: '',
-					// 	secret_key: '',
-					// 	region: ''
-					// },
-					// onedata:{
-					// 	oneprovider_host: '',		
-					// 	token: '',		
-					// 	space: ''
-					// },
-				},
-				limits_cpu: '',
-				limits_memory: '',
-				regAuth: '',
-				request_cpu: '',
-				request_memory: '',
-				secrets: '',
-				script: '',
-				
-				
-			},
-			progress: {
-				active: false
-			},
-			model_create: 'tab-minio',
-			tabs_in_out: 'tab-input',
-			showinput: true,
-			memory: '',
-			varsEnv: '',
-			editScript: false
-
-
-		}
-	},
-	methods: {
-		editSummernote(){
-			var _this = this
-            $('.summernote').summernote(
-                {
-					callbacks:{
-						onInit: function() {
-							 $('.summernote').summernote('codeview.activate');
-						},		
-					},
-					codeviewFilter: true,
-  					codeviewIframeFilter: true,
-					focus: true,
-					height: 200,                 // set editor height
-					minHeight: null,             // set minimum height of editor
-					maxHeight: null,             // set maximum height of editor
-                    toolbar: [
-                        // [groupName, [list of button]]
-                        ['style', ['bold', 'italic', 'underline', 'clear']],
-                        ['font', ['strikethrough', 'superscript', 'subscript']],
-                        ['fontsize', ['fontsize']],
-                        ['color', ['color']],
-                        ['para', ['ul', 'ol', 'paragraph']],
-						['height', ['height']],
-						['view', ['codeview']]
-					],
-					codemirror: { // codemirror options
-						theme: 'monokai',
-						lineNumbers: true,
-						lineWrapping: true,
-    					tabMode: 'indent'
-					},
-					
-                })
-                .on("summernote.enter", function(we, e) {
-                    $(this).summernote("pasteHTML", "<br><br>");
-                    e.preventDefault();
-				});
-				 $('.summernote').summernote('code',_this.base64String)
-        },
-        saveSummernote(){
-			this.base64String = $('.summernote').summernote('code')
-			$('.summernote').summernote('destroy');
-			setTimeout(function(){
-				$('.summernote').css('display','none');
-			},100)
-            this.editScript = false
-        },
-
-		show(id){
-			$("#myTabContent .tab-pane-content").removeClass("show active")
-			$("#myTab .nav-link").removeClass("show active")
-			$("#"+id).addClass("show active")
-			$("#"+id+"-tab").addClass("show active")
-		},
-		show_input(id){
-			$("#myTabContentInOut .tab-pane-inout").removeClass("show active")
-			$("#myTabInOut .nav-link").removeClass("show active")
-			$("#"+id).addClass("show active")
-			$("#"+id+"-tab").addClass("show active")
-		},
-		
-		handleUpdate(){
-			this.$emit("SHOWSPINNER",true)			 
-      		window.getApp.$emit('REFRESH_BUCKETS_LIST')
-      		window.getApp.$emit('BUCKETS_REFRESH_DASHBOARD')
-      		window.getApp.$emit('FUNC_GET_FUNCTIONS_LIST')
-    	},
-		cleanfield(){
-			this.url=""
-		},
-		cleanfieldenv(){
-			this.form.envVarskey=""
-			this.form.envVarsValue=""
-		},		
-		cleanfieldInput(){
-			this.form.path_in=""		
-			this.form.storage_provider_in=""	
-			this.cleanfieldPrefixIn()	
-			this.cleanfieldSuffixIn()	
-		},
-		cleanfieldPrefixIn(){
-			this.form.prefix_in=""		
-		},
-		cleanfieldSuffixIn(){
-			this.form.suffix_in=""		
-		},
-		includePrefixIn(){
-			this.showselectPrefixIn = true
-			this.prefixs_in.push(this.form.prefix_in)
-			this.cleanfieldPrefixIn()
-		},
-		includeSuffixIn(){
-			this.showselectSuffixIn = true
-			this.suffixs_in.push(this.form.suffix_in)
-			this.cleanfieldSuffixIn()
-		},
-		includeInput(){
-			this.showselectInput=true
-			var input = {
-				"path":this.form.path_in,
-				"storage_provider":this.form.storage_provider_in,
-				"prefix":this.prefixs_in,
-				"suffix":this.suffixs_in
-			}
-			this.inputs.push(input)
-			input = {}
-			this.prefixs_in=[]
-			this.suffixs_in=[]
-			this.cleanfieldInput()						
-			this.cleanfieldPrefixIn()						
-			this.cleanfieldSuffixIn()	
-			if (this.isEmpty(this.prefixs_in)) {
-				this.showselectPrefixIn = false
-			}
-			if (this.isEmpty(this.suffixs_in)) {
-				this.showselectSuffixIn = false
-			}					
-		},
-		cleanfieldOutput(){
-			this.form.path_out=""		
-			this.form.storage_provider_out=""	
-			this.cleanfieldPrefixOut()	
-			this.cleanfieldSuffixOut()	
-		},
-		cleanfieldPrefixOut(){
-			this.form.prefix_out=""		
-		},
-		cleanfieldSuffixOut(){
-			this.form.suffix_out=""		
-		},
-		includePrefixOut(){
-			this.showselectPrefixOut = true
-			this.prefixs_out.push(this.form.prefix_out)
-			this.cleanfieldPrefixOut()
-		},
-		includeSuffixOut(){
-			this.showselectSuffixOut = true
-			this.suffixs_out.push(this.form.suffix_out)
-			this.cleanfieldSuffixOut()
-		},
-		includeOutput(){
-			this.showselectOutput=true
-			var output = {
-				"path":this.form.path_out,
-				"storage_provider":this.form.storage_provider_out,
-				"prefix":this.prefixs_out,
-				"suffix":this.suffixs_out
-			}
-			this.outputs.push(output)
-			output = {}
-			this.prefixs_out=[]
-			this.suffixs_out=[]
-			this.cleanfieldOutput()						
-			this.cleanfieldPrefixOut()						
-			this.cleanfieldSuffixOut()	
-			if (this.isEmpty(this.prefixs_out)) {
-				this.showselectPrefixOut = false
-			}
-			if (this.isEmpty(this.suffixs_out)) {
-				this.showselectSuffixOut = false
-			}					
-		},
-		includeEnv(){
-			this.showselectEnv=true
-			var key= this.form.envVarskey.replace(" ", "")
-			var value = this.form.envVarsValue.replace(" ", "")
-			this.envVars[key]=value
-			this.cleanfieldenv()						
-		},		
-		isEmpty(obj) {
-			for(var key in obj) {
-				if(obj.hasOwnProperty(key))
-					return false;
-			}
-			return true;
-		},
-		removeEnv (key) {     
-			this.$delete(this.envVars,key)			
-			if (this.isEmpty(this.envVars)) {
-				this.showselectEnv = false
-			}		
-		},	
-		removeInput (key) {     
-			this.$delete(this.inputs,key)			
-			if (this.isEmpty(this.inputs)) {
-				this.showselectInput = false
-			}		
-		},
-		removeOutput (key) {     
-			this.$delete(this.outputs,key)			
-			if (this.isEmpty(this.outputs)) {
-				this.showselectOutput = false
-			}		
-		},
-		removePrefixIn (key) {     
-			this.$delete(this.prefixs_in,key)			
-			if (this.isEmpty(this.prefixs_in)) {
-				this.showselectPrefixIn = false
-			}		
-		},
-		removeSuffixIn (key) {     
-			this.$delete(this.suffixs_in,key)			
-			if (this.isEmpty(this.suffixs_in)) {
-				this.showselectSuffixIn = false
-			}		
-		},	
-		collapse(){			
-			this.drawer = (!this.drawer)			
-			if (this.drawer == true){
-				this.expand = "expand_less"
-				$("#panel").slideDown("slow");
-
-			}else{
-				this.expand = "expand_more"
-				$("#panel").slideUp("slow");
-			}			
-		},
-		addFiles () {      		
-			this.$refs.files.click()		
-		},
-		removeFile (key) {     
-			this.files.splice(key, 1)
-			this.$refs.files.value = null
-			// this.base64String = ''
-			$('.summernote').summernote('destroy');
-			setTimeout(function(){
-				$('.summernote').css('display','none');
-			},100)
-		},		
-		handleFilesUpload () {
-			this.files = []      
-			let uploadedFiles = this.$refs.files.files			
-			this.filerequire = false
-			/*
-				Adds the uploaded file to the files array
-			*/
-			for (let i = 0; i < uploadedFiles.length; i++) {
-				this.showUploading = false
-				this.filename = uploadedFiles[i].name
-				this.files.push(uploadedFiles[i])
-			}			
-			if (window.File && window.FileReader && window.FileList && window.Blob) {
-				var f = this.files[0]; // FileList object
-				
-				var reader = new FileReader();
-				// Closure to capture the file information.
-				var _this = this;
-				reader.onload = (function(theFile) {
-				return function(e) {
-					var binaryData = e.target.result;
-
-					//Reading as String
-					_this.base64String = binaryData
-					//Converting Binary Data to base 64
-					// _this.base64String = window.btoa(binaryData);
-				};
-				})(f);
-				// Read in the image file as a data URL.
-				// reader.readAsBinaryString(f);
-				// reader.readAsBinaryString(f);
-				reader.readAsText(f)
-			} else {
-				alert('The File APIs are not fully supported in this browser.');
-			}      
-		
-		},
-		readurl(){     
-			this.files = [] 		
-			let uploadedFiles = this.url						
-			this.showUploading = false
-			this.filename = this.url
-			this.files.push(uploadedFiles)
-			var _this = this
-			fetch(this.url).then(r => r.blob()).then(blob => {
-				var reader = new FileReader();
-				reader.onload = function() {
-					_this.base64String = reader.result.replace(/^data:.+;base64,/, '');
-					// Convert to string because new OSCAR version doesn't need base64
-					_this.base64String = atob(_this.base64String)
-				};
-				reader.readAsDataURL(blob);
-			});
-			this.cleanfield()
-		},
-		closeWithoutSave() {      
-			this.progress.active = false
-			this.dialog = false            
-			this.clear()      
-		},
-		extend(obj, src) {
-				for (var key in src) {
-					if (src.hasOwnProperty(key)) obj[key] = src[key];
-				}
-				return obj;
-		},
-		submit () {	
-
-			if(this.$refs.form.validate() && this.editionMode == true && this.base64String != ''){
-					this.editFunction()
-			}else if (this.$refs.form.validate() && this.files.length != 0) {
-				this.progress.active = true
-				this.editionMode ? this.editFunction() : this.newFunction()				
-				this.envrequirehost = false
-				this.envrequiretoken = false
-				this.envrequirespace = false
-			}else {
-				if (this.files.length == 0){
-					this.filerequire = true
-				}else{
-					this.filerequire = false
-				}	
-				this.show('home')
-			}
-						
-					
-						
-		},
-		clear () {
-			this.files = []
-			this.url = ""
-			this.$refs.files.value = null
-			this.$refs.form.reset()
-			this.editionMode = false
-			this.showUploading = false
-			this.showselectEnv = false
-			this.envVars = {}
-			this.anns = {}
-			this.labels = {}
-			this.expand = "expand_more"
-			$("#panel").slideUp("slow");
-			$("#home-tab").addClass("show active")
-			$("#home").addClass("show active")
-			$("#input_output-tab").removeClass("show active")
-			$("#input_output").removeClass("show active")
-			$("#profile-tab").removeClass("show active")
-			$("#profile").removeClass("show active")
-			this.minio.access_key = ''
-			this.minio.secret_key = ''
-			this.minio.endpoint = ''
-			this.minio.verify = true
-			this.onedata.oneprovider_host = ''
-			this.onedata.token = ''
-			this.onedata.space = ''
-			this.s3.access_key = ''
-			this.s3.secret_key = ''
-			this.s3.region = ''
-			this.prefixs_in = []
-			this.suffixs_in = []
-			this.inputs = []
-			this.cleanfieldInput()
-			this.prefixs_out = []
-			this.suffixs_out = []
-			this.outputs = []
-			this.cleanfieldOutput()
-			this.showselectPrefixIn = false
-			this.showselectSuffixIn = false
-			this.showselectPrefixOut = false
-			this.showselectSuffixOut = false
-			this.showselectInput = false
-			this.showselectOutput = false
-			this.select_logLevel = 'INFO'
-			this.editScript = false
-			this.base64String = ''
-			$('.summernote').summernote('destroy');
-			setTimeout(function(){
-				$('.summernote').css('display','none');
-			},100)
-			
-		},
-		newFunction () {
-			if (this.minio.endpoint != "") {
-				this.form.storage_provider["minio"]=this.minio
-			}
-			if (this.s3.access_key != ""){
-				this.form.storage_provider["s3"]=this.s3
-			}
-			if (this.onedata.oneprovider_host != ""){
-				this.form.storage_provider["onedata"]=this.onedata
-			}
-			
-			var value = $("#classmemory option:selected").text();			
-				
-
-			if (this.form.limits_memory == ""){
-				this.limits_mem = ''
-			}else{
-				this.limits_mem = this.form.limits_memory + value;
-			}
-
-			var params = {
-				
-				'name': this.form.name, 
-				'image': this.form.image, 
-				'cpu': this.form.limits_cpu,
-				'memory': this.limits_mem,
-				'log_level': this.select_logLevel,
-				'environment': {
-					"Variables":this.envVars
-				},
-				'input': this.inputs,
-				'output': this.outputs,
-				'script': this.base64String,
-				'storage_providers':this.form.storage_provider
-
-			}
-			this.createServiceCall(params,this.createServiceCallBack)	
-			
-		},
-		createServiceCallBack(response){
-			if(response.status == 201){
-				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: `Function ${this.form.name} was successfully created.`, color: 'success', timeout: 12000 })
-				this.dialog = false;
-				this.clear()
-				this.updateFunctionsGrid()
-
-			}else {
-				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: response, color: 'error' })
-			}
-			this.progress.active = false
-
-		},
-		editFunction () {
-			if (this.minio.endpoint != "") {
-				this.form.storage_provider["minio"]=this.minio
-			}
-			if (this.s3.access_key != ""){
-				this.form.storage_provider["s3"]=this.s3
-			}
-			if (this.onedata.oneprovider_host != ""){
-				this.form.storage_provider["onedata"]=this.onedata
-			}
-			
-			var value = $("#classmemory option:selected").text();
-			if (this.form.limits_memory == ""){
-				this.limits_mem = ''
-			}else{
-				this.limits_mem = this.form.limits_memory + value;
-			}
-			var script = ''
-			if (this.script == '') {
-				script = this.base64String
-			}else{
-				script = this.script
-			}
-			var params = {
-				
-				'name': this.form.name, 
-				'image': this.form.image, 
-				'cpu': this.form.limits_cpu,
-				'memory': this.limits_mem,
-				'log_level': this.select_logLevel,
-				'environment': {
-					"Variables":this.envVars
-				},
-				'input': this.inputs,
-				'output': this.outputs,
-				'script': this.base64String,
-				'storage_providers':this.form.storage_provider
-
-			}	
-			this.editServiceCall(params, this.editServiceCallBack)
-			
-		},
-		editServiceCallBack(response){
-			if(response.status == 204){
-				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: `Function ${this.form.name} has been updated`, color: 'success' })
-				this.dialog = false;
-				this.clear()
-				this.updateFunctionsGrid()
-				window.getApp.$emit('REFRESH_BUCKETS_LIST')
-			}else {
-				window.getApp.$emit('APP_SHOW_SNACKBAR', { text: response, color: 'error' })
-			}
-			this.progress.active = false
-
-		},
-		updateFunctionsGrid () {
-			window.getApp.$emit('FUNC_GET_FUNCTIONS_LIST')
-		}
-	},
-	computed: {
-		
-		formTitle () {
-			return this.editionMode ? 'Edit Service' : 'New Service'
-		},
-		formColor () {
-			return this.editionMode ? 'blue lighten-2' : 'teal lighten-3'
-		},
-		showSelectedFiles () {
-			return this.files.length > 0
-		},
-		
-	},
-  
-	created: function () {
-		window.getApp.$on('FUNC_OPEN_MANAGEMENT_DIALOG', (data) => {
-			this.dialog = true
-			this.editionMode = data.editionMode
-			this.form.name = data.name
-			this.form.image = data.image
-			this.inputs = data.input
-			this.outputs = data.output
-			this.form.limits_cpu = data.cpu
-			var memory_split = []
-			memory_split = data.memory.match(/[a-z]+|[^a-z]+/gi);
-			this.form.limits_memory = memory_split[0]
-			if (memory_split[1] == "Mi"){
-				var value_select = "1"
-			}else{
-				var value_select = "2"
-			}
-			setTimeout(function(){
-				$('#classmemory').val(value_select)
-			},100)
-			var key=''
-			var values= ''
-			key = Object.keys(data.envVars.Variables)
-			values = Object.values(data.envVars.Variables)
-			for (let i = 0; i < key.length; i++) {
-				this.envVars[key[i]]=values[i]
-			}
-			if(key.length){
-				this.showselectEnv = true
-			}else{
-				this.showselectEnv = true
-			}
-			setTimeout(function(){
-				this.select_logLevel = data.log_Level
-			},100)
-		
-			if (this.isEmpty(this.inputs)) {
-				this.showselectInput = false
-			}else{
-				this.showselectInput = true
-			}	
-			if (this.isEmpty(this.outputs)) {
-				this.showselectOutput = false
-			}else{
-				this.showselectOutput = true
-			}
-			this.base64String = data.script
-		})
-	}
-}
-</script>
-
-<style scoped>
-
-.active {
-	color: black !important;
-  	background-color: transparent !important;
-  	border-bottom: yellowgreen solid 2px;
-}
-.list__tile {
-  height: 6rem !important;
-}
- #flip {
-    /* padding: 5px; */
-    /* text-align: center; */
-    background-color: #e5eecc;
-    border: solid 1px #c3c3c3;
-}
-
-#panel {
-    /* padding: 50px; */
-    display: none;
-}
-
-#test {
-  text-align: left,
-}
-.v-btn.v-btn--outline {
-    border: none;
-    background: transparent !important;
-    box-shadow: none;
-}
-
-	/* Small devices (landscape phones, 576px and up)*/
-@media (min-width: 576px) { 
-		.custom-select{
-		height: calc(2.25rem + 3px);
-		width: 100%
-	}
-	}
-
-/*Medium devices (tablets, 768px and up)*/
-@media (min-width: 768px) { 
-	.custom-select{
-		height: calc(2.25rem + 3px);
-		width: 100%
-	}
-	}
-
-/*Large devices (desktops, 992px and up)*/
-@media (min-width: 992px) { 
-	.custom-select{
-		height: calc(2.25rem + 3px);
-		width: 100%
-	}
-	}
-
-/* Extra large devices (large desktops, 1200px and up)*/
-@media (min-width: 1200px) { 
-	.custom-select{
-		height: calc(2.25rem + 3px);
-		width: 75%
-	}
-}
-</style>
diff --git a/vue_app/vue.config.js b/vue_app/vue.config.js
deleted file mode 100644
index 5888892..0000000
--- a/vue_app/vue.config.js
+++ /dev/null
@@ -1,13 +0,0 @@
-// vue.config.js
-module.exports = {
-  publicPath: './',
-  // devServer: {
-  //   proxy: {
-  //     '/system': {
-  //       target: 'http://192.168.99.100:31112/',
-  //       ws: true,
-  //       changeOrigin: true
-  //     }
-  //   }
-  // }
-}