aegisbigdata · fabiankirstein · Jun 25, 2019 · Jun 18, 2019 · Jun 24, 2019 · Jun 24, 2019
diff --git a/aegis-web/yo/app/images/aegis-favicon.png b/aegis-web/yo/app/images/aegis-favicon.png
diff --git a/aegis-web/yo/app/images/home_getting_started.png b/aegis-web/yo/app/images/home_getting_started.png
diff --git a/aegis-web/yo/app/images/home_marketplace.png b/aegis-web/yo/app/images/home_marketplace.png
diff --git a/aegis-web/yo/app/images/home_news.png b/aegis-web/yo/app/images/home_news.png
diff --git a/aegis-web/yo/app/index.html b/aegis-web/yo/app/index.html
@@ -40,10 +40,10 @@
 <html>
   <head>
     <meta charset="utf-8">
-    <title>Hopsworks</title>
+    <title>AEGIS</title>
     <meta name="description" content="">
     <meta name="viewport" content="width=device-width">
-    <link rel="icon" type="image/png" href="images/hops-black.png" />
+    <link rel="icon" type="image/png" href="images/aegis-favicon.png" />
     <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto'>
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/v4-shims.css">

diff --git a/aegis-web/yo/app/landing/assets/aegis-favicon.png b/aegis-web/yo/app/landing/assets/aegis-favicon.png
diff --git a/aegis-web/yo/app/landing/index.html b/aegis-web/yo/app/landing/index.html
@@ -42,17 +42,15 @@
 
 <head>
   <meta charset="utf-8" />
-  <title>Hopsworks</title>
+  <title>AEGIS</title>
   <meta name="description" content="" />
   <meta name="viewport" content="width=device-width" />
-  <link rel="icon" type="image/png" href="../images/hops-black.png" />
+  <link rel="icon" type="image/png" href="assets/aegis-favicon.png" />
   <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto" />
 
   <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
   <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
   <link rel="stylesheet" type="text/css" href="./css/animate.css" />
-  <link rel="shortcut icon" type="image/x-icon" href="https://www.aegis-bigdata.eu/wp-content/uploads/2017/03/aegis.png" />	<script type="text/javascript"></script>
-  <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
   <link rel="stylesheet" href="css/style.css" />
   <link rel="stylesheet" href="css/queries.css" />
 </head>

diff --git a/aegis-web/yo/app/navProject.html b/aegis-web/yo/app/navProject.html
@@ -64,7 +64,7 @@
 
       <li ng-click="projectCtrl.goToDatasets()" ng-show="projectCtrl.cloak" id="datasetsTab">
         <a>
-          <span class="sub_icon fa fa-folder" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-folder"></span>
           Datasets
           <i class=" pull-right fa " 
              uib-tooltip="Orange triangle: the filesystem is encountering problems. Red means the filesystem is down."                          
@@ -75,7 +75,7 @@
 
       <li ng-click="projectCtrl.goToSettings()" ng-show="projectCtrl.cloak">
         <a>
-          <span class="sub_icon fa fa-cog fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-cog"></span>
           Settings
         </a>
       </li>
@@ -89,21 +89,21 @@
 
       <li ng-click="projectCtrl.membersModal()" ng-show="projectCtrl.cloak">
         <a>
-          <span class="sub_icon fa fa-users fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-users"></span>
           Members
         </a>
       </li>
 
       <li ng-click="projectCtrl.goToProjectActivities()" ng-show="projectCtrl.cloak">
         <a>
-          <span class="sub_icon fa fa-list fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-list"></span>
           Activity-Stream
         </a>
       </li>
 
       <!-- li ng-click="projectCtrl.goToMetadataDesigner()" ng-show="projectCtrl.role === 'Data owner'" ng-show="projectCtrl.cloak">
         <a>
-          <span class="sub_icon fa fa-edit fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-edit"></span>
           Metadata Designer
         </a>
       </li -->
@@ -112,35 +112,40 @@
 
       <li ng-click="projectCtrl.goToProjectExtendedMetadata()">
         <a>
-          <span class="sub_icon fa fa-tags fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-tags"></span>
           Extended Metadata
         </a>
       </li>
 
       <li ng-click="projectCtrl.goToJupyter()" ng-show="projectCtrl.showJupyter()">
         <a>
-          <img style="margin-right: 10px" width="30" src="images/jupyter-200x200-bw.png" id="jupyterTab"/>AEGIS Tools
+          <span class="menu_icon">
+            <img src="images/jupyter-200x200-bw.png" id="jupyterTab"/>
+          </span>
+          AEGIS Jupyter Tools
           <i class="pull-right fa"  
              uib-tooltip="Orange triangle: jobs are encountering problems. Red means Jobs cannot be run just now." 
              tooltip-placement="auto right"
              ng-class="{'fa-ban text-danger': clusterUtilCtrl.YarnBan, 'fa-exclamation-triangle text-warning': clusterUtilCtrl.YarnWarn }" aria-hidden="true"></i>          
         </a>
       </li>
 
-      <li ng-click="projectCtrl.goToZeppelin()" ng-show="projectCtrl.showZeppelin()">
+      <!--<li ng-click="projectCtrl.goToZeppelin()" ng-show="projectCtrl.showZeppelin()">
         <a>
-          <img style="margin-right: 10px" width="30" src="images/zeppelin_logo.png"/>
+          <span class="menu_icon">
+            <img src="images/zeppelin_logo.png"/>
+          </span>
           Zeppelin
           <i class=" pull-right fa " 
              uib-tooltip="Orange triangle: jobs are encountering problems. Red means Jobs cannot be run just now." 
              tooltip-placement="auto right"
              ng-class="{'fa-ban text-danger': clusterUtilCtrl.YarnBan, 'fa-exclamation-triangle text-warning': clusterUtilCtrl.YarnWarn }" aria-hidden="true"></i>                    
         </a>
-      </li>
+      </li>-->
 
       <li ng-click="projectCtrl.goToJobs()" ng-show="projectCtrl.showJobs()" id="jobsTab">
         <a>
-          <span class="sub_icon fa fa-cogs fa-lg" style="width: 30px; display: inline-block; margin-right: 10px"></span>
+          <span class="menu_icon fa fa-lg fa-cogs"></span>
           Jobs
           <i class=" pull-right fa " 
              uib-tooltip="Orange triangle: jobs are encountering problems. Red means Jobs cannot be run just now."              
@@ -152,7 +157,9 @@
       <li ng-click="projectCtrl.goToKafka()"
           ng-show="projectCtrl.showKafka()">
         <a>
-          <img style="margin-right:20px" height="25" src="images/kafka_logo.png" id="kafkaTab"/>
+          <span class="menu_icon">
+            <img  src="images/kafka_logo.png" id="kafkaTab"/>
+          </span>
           Kafka 
           <i class=" pull-right fa " 
              uib-tooltip="Orange triangle: Kafka is encountering problems. Red means Kafka is down."             
@@ -162,30 +169,39 @@
       </li>
       <li ng-click="projectCtrl.goToService('DELA')" ng-show="projectCtrl.showDela()">
         <a>
-          Dela<img class="pull-right" style="margin-right:15px" height="25" src="images/dela-green.png">
+          <span class="menu_icon">
+            <img src="images/dela-green.png">
+          </span>
+          Dela
         </a>
       </li>
 
       <li ng-click="projectCtrl.goToTensorflow()" ng-show="projectCtrl.showTensorflow()">
         <a>
+          <span class="menu_icon">
+              <img ng-show="projectCtrl.activeService !== 'tensorflow'" src="images/tf-175x200_bw.png"/>
+              <img ng-show="projectCtrl.activeService === 'tensorflow'" src="images/tf-175x200.png"/>
+          </span>
           Tensorflow
-          <img ng-show="projectCtrl.activeService !== 'tensorflow'" class="pull-right" style="margin-left:10px" height="25" src="images/tf-175x200_bw.png"/>
-          <img ng-show="projectCtrl.activeService === 'tensorflow'" class="pull-right" style="margin-left:10px" height="25" src="images/tf-175x200.png"/>
         </a>
       </li>
 
 
       <li ng-click="projectCtrl.goToRStudio()" ng-show="projectCtrl.showRStudio()">
         <a>
-          RStudio<img class="pull-right" style="margin-right:15px" height="25" src="images/rstudio.png">
+          <span class="menu_icon">
+            <img src="images/rstudio.png"/>
+          </span>
+          RStudio
         </a>
       </li>
 
       <li ng-click="projectCtrl.goToTfServing()" ng-show="projectCtrl.showTfServing()" id="servingTab">
-        <a class="left-right">
-          <img style="margin-right:10px" height="25" src="images/tf-175x200_bw.png"/>
+        <a>
+          <span class="menu_icon">
+            <img src="images/tf-175x200_bw.png"/>
+          </span>
           Model Serving
-
         </a>
       </li>
 

diff --git a/aegis-web/yo/app/scripts/controllers/jupyterCtrl.js b/aegis-web/yo/app/scripts/controllers/jupyterCtrl.js
@@ -942,5 +942,23 @@ angular.module('hopsWorksApp')
                     }
                 })
             };
+
+            self.openTool = function(toolpath, dataset, datasetPathArray) {
+                var param = "";
+                if (typeof dataset === "string") {
+                    var path = (datasetPathArray instanceof Array) ? datasetPathArray.slice() : [];
+                    path.push(dataset);
+                    path = encodeURIComponent(path.join('/'));
+                    param = `&dataset=${path}`
+                }
+                self.executeIfStarted(function(started) {
+                    if (started) {
+                        $window.open(
+                            `/hopsworks-api/jupyter/${self.config.port}/notebooks/${toolpath}?token=${self.config.token}${param}`, 
+                            '_blank'
+                        );
+                    }
+                })
+            };
         }
     ]);
diff --git a/aegis-web/yo/app/scripts/services/AegisToolsService.js b/aegis-web/yo/app/scripts/services/AegisToolsService.js
@@ -20,7 +20,8 @@ angular.module('hopsWorksApp')
                 img: "images/tools-visualizer.png",
                 description: "Easily transform heaps of data to a wide sset of visualisations.",
                 documentationUrl: "https://github.com/aegisbigdata/documentation/wiki/Visualizer",
-                sourceUrl: "https://github.com/aegisbigdata/visualizer"
+                sourceUrl: "https://github.com/aegisbigdata/visualizer",
+                supportDatasetParam: true
             },
             {
                 name: "Algorithm Execution Container",

diff --git a/aegis-web/yo/app/styles/aegis.css b/aegis-web/yo/app/styles/aegis.css
@@ -1,3 +1,16 @@
+html, body {
+  background-color: #fff;
+}
+.menu_icon {
+  width: 30px !important;
+  display: inline-block !important; 
+  margin-right: 10px;
+  text-align: center;
+}
+.menu_icon > img {
+  max-width: 30px;
+  max-height: 22px;
+}
 .panel-logo-img {
   height: 50px;
 }

diff --git a/aegis-web/yo/app/styles/filebrowser.css b/aegis-web/yo/app/styles/filebrowser.css
@@ -380,7 +380,6 @@ md-backdrop.md-sidenav-backdrop {
 }
 .dropdown-amore {
   border-radius: 0px;
-  width: 250px;
   margin:0px;
   padding:0px;
 }
@@ -395,19 +394,6 @@ md-backdrop.md-sidenav-backdrop {
 }
 
 
-.dropdown-amore li:first-child {
-  border-left: 3px solid #314190;
-}
-.dropdown-amore li:nth-child(2) {
-  border-left: 3px solid #79aefe;
-}
-.dropdown-amore li:nth-child(3) {
-  border-left: 3px solid #7d5d81;
-}
-.dropdown-amore li:nth-child(4) {
-  border-left: 3px solid #ec1b5a;
-}
-
 .table-hover > tbody > tr.highlight {
   background-color:#4285f4;
   color:white;

diff --git a/aegis-web/yo/app/styles/style.css b/aegis-web/yo/app/styles/style.css
@@ -624,7 +624,6 @@ md-input-container {
 .dropdown-menu {
   box-shadow: 0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);
   border: none;
-  width: 280px;
 }
 
 .dropdown-menu > li > a {

diff --git a/aegis-web/yo/app/styles/timeline.css b/aegis-web/yo/app/styles/timeline.css
@@ -40,16 +40,17 @@
 
 .timeline {
   margin: 0;
-  padding: 0;
+  padding: 20 0;
   position: relative;
 }
-.timeline .mid-line {
-  background: none repeat scroll 0 0 #ededed;
-  height: 100%;
-  /*left: 50%;*/
-  margin-left: -1.5px;
-  position: absolute;
-  width: 3px;
+.timeline .timeline-item {
+  border-left: 2px solid #ededed;
+  padding-bottom: 15px;
+}
+.timeline .timeline-item:last-of-type {
+  border-image: -moz-linear-gradient(top, rgba(237,237,237,1) 0%, rgba(0, 0, 0, 0) 90%) 1;
+  border-image: -webkit-linear-gradient(top, rgba(237,237,237,1) 0%, rgba(0, 0, 0, 0) 90%) 1;
+  border-image: linear-gradient(to bottom, rgba(237,237,237,1) 0%, rgba(0, 0, 0, 0) 90%) 1;
 }
 .timeline .time-header {
   border: 1px solid #ededed;
@@ -95,9 +96,6 @@
   text-align: left;
   margin-bottom: -10px;
 }
-.timeline .pagination {
- display: unset;
-}
 .timeline .time-header.completed {
   background: none repeat scroll 0 0 #3eb157;
   border: 1px solid #35974a;
@@ -110,14 +108,6 @@
   background: none repeat scroll 0 0 #d13736;
   border: 1px solid #b92b2a;
 }
-.timeline > div {
-  clear: left;
-  float: left;
-  margin-bottom: 15px;
-  position: relative;
-  width: 100%;
-  z-index: 2;
-}
 .timeline > .right {
   clear: right;
   float: left;

diff --git a/aegis-web/yo/app/styles/tools-jupyter-overview.css b/aegis-web/yo/app/styles/tools-jupyter-overview.css
@@ -32,9 +32,11 @@
 .card-tool-text{
     text-align: center;
     color: grey;
-    padding: 5% 5% 5% 5%;
+    padding: 10px;
     margin-bottom: 0px;
-
+    height: 86px;
+    overflow-x: auto;
+    background-color: #fff;
 }
 .card-body-bottom{
     width:100%;
@@ -67,6 +69,11 @@
 .card-tool-bottom-link-morethan{
     float:right;
 }
+
+.tool-card {
+    margin-right: 0;
+}
+
 /* .card-inner-custom{
     position: relative;
     width: 100%;

diff --git a/aegis-web/yo/app/views/datasetsBrowser.html b/aegis-web/yo/app/views/datasetsBrowser.html
@@ -42,6 +42,7 @@
          class="toggled"
          ng-controller="DatasetsCtrl as datasetsCtrl">
       <div ng-controller="MetadataCtrl as metadataCtrl">
+      <div ng-controller="JupyterCtrl as jupyterCtrl">
         <div class="overlay" ></div>
         <div ng-include="'navProject.html'"></div>
         <section>
@@ -266,7 +267,7 @@ <h4 class="content-utility-bar-h4"><a ng-click="datasetsCtrl.goToDataSetsDir()">
                         </td>
                         <td uib-dropdown class="position-fixed" id="menu-{{ $index}}" style="border-top: none">
                           <ul uib-dropdown-menu class="dropdown-amore" role="menu">
-                            <li ng-show="datasetsCtrl.pathArray[0] === 'Jupyter' && datasetsCtrl.isSelectedFiles() <= 1 &&  file.name.substr(-6) === '.ipynb'"  ng-controller="JupyterCtrl as jupyterCtrl">
+                            <li ng-show="datasetsCtrl.pathArray[0] === 'Jupyter' && datasetsCtrl.isSelectedFiles() <= 1 &&  file.name.substr(-6) === '.ipynb'">
                               <a class="pointer"
                                  role="menuitem"
                                  tabindex="10"
@@ -277,6 +278,17 @@ <h4 class="content-utility-bar-h4"><a ng-click="datasetsCtrl.goToDataSetsDir()">
                                   Open Jupyter Notebook</span>
                               </a>
                             </li>
+                            <li ng-show="!file.dir && datasetsCtrl.isSelectedFiles() <= 1 &&  file.name.substr(-4) === '.csv'" ng-repeat="aegisTool in aegisTools"  ng-if="aegisTool.supportDatasetParam">
+                                <a class="pointer"
+                                   role="menuitem"
+                                   tabindex="10"
+                                   ng-click="jupyterCtrl.openTool(aegisTool.notebook, file.name, datasetsCtrl.pathArray)"
+                                   data-toggle="uib-tooltip" title="Open this file with {{aegisTool.name}} in new window."
+                                   >
+                                  <span><img src="{{aegisTool.img}}" style="height: 14px; margin-right: 8px;"/>
+                                    Open with {{aegisTool.name}}</span>
+                                </a>
+                              </li>
                             <li ng-show="datasetsCtrl.isSelectedFiles() <= 1" 
                                 ng-hide="datasetsCtrl.isZippedfile()===false">
                               <a class="pointer"
@@ -656,5 +668,6 @@ <h2 style="margin:0;">
             </div>
         </section>
       </div>
+      </div>
     </div>
   </div>