Update Layout: Define menu groups

slapos/runner/static/css/styles.css

@@ -28,7 +28,7 @@ td{
     border-right: 1px solid #A8A8A8;
 }
 td.propertie{padding-left:10px; color:blue;width: 178px;}
-.slapvalues{display:block;width: 375px;word-wrap: break-word}
+.slapvalues{display:block;width: 522px;word-wrap: break-word}
 td.first{border-left: 1px solid #A8A8A8;}
 th{
     background: #2281C1;
@@ -122,7 +122,7 @@ overflow-y: scroll;
     margin:0;
     margin-top:1px;
     padding:0;
-    margin-left:40px;
+    margin-left:20px;
 }
 
 .space{
@@ -163,11 +163,11 @@ overflow-y: scroll;
     text-shadow:1px 1px 0 #E6EDF2;
 }
 
-
+.wmenu ul li.sep{border-right: 1px solid #c2c2c2; min-width:22px; height:34px}
 .wmenu ul li a{
     display:block;
     height: 20px;
-    Color:#000;
+    Color:#275777;
     /*background: url(../images/sep.png) right center no-repeat;*/
     border-right: 1px solid #c2c2c2;
     /*font-weight:bold;*/

slapos/runner/static/js/scripts/process.js

@@ -181,7 +181,7 @@ function setRunningState(data) {
         if ($current !== undefined) {
             $current.empty();
             $current.append("Run " + processType.toLowerCase());
-            $current.css("color", "#000");
+            $current.css("color", "#275777");
             $current = undefined;
             currentState = false;
             $("#error").Popup("Slapgrid finished running your " + processType + " Profile", {type: 'info', duration: 3000});

slapos/runner/static/js/scripts/softwareFolder.js

@@ -49,16 +49,16 @@ $(document).ready(function () {
                 url: $SCRIPT_ROOT + '/getFileContent',
                 data: {file: file},
                 success: function (data) {
-                    var name, start;
+                    var name, start, path = file;
                     if (data.code === 1) {
                         $("#edit_info").empty();
                         name = file.split('/');
                         if (file.length > 60) {
                             //substring title.
                             start = file.length - 60;
-                            file = "..." + file.substring(file.indexOf("/", (start + 1)));
+                            path = "..." + file.substring(file.indexOf("/", (start + 1)));
                         }
-                        $("#edit_info").append(" " + file);
+                        $("#edit_info").append(" " + path);
                         $("a#option").show();
                         editor.getSession().setValue(data.result);
                         setEditMode(name[name.length - 1]);
@@ -102,18 +102,17 @@ $(document).ready(function () {
     } */
 
     function switchContent() {
-        var root = projectDir;
         if (!softwareDisplay) {
             $("#switch").empty();
             $("#switch").append("Switch to Profile ");
-            root = currentProject;
+            $('#fileTreeFull').show();
+            $('#fileTree').hide();
         } else {
             $("#switch").empty();
             $("#switch").append("Switch to Project");
+            $('#fileTree').show();
+            $('#fileTreeFull').hide();
         }
-        $('#fileTree').fileTree({ root: root, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function (file) {
-            selectFile(file);
-        }, function (file) { openFile(file); });
         $("#info").empty();
         $("#info").append("Selection: " + base_path());
         selection = "";
@@ -199,6 +198,9 @@ $(document).ready(function () {
     $('#fileTree').fileTree({ root: projectDir, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function (file) {
         selectFile(file);
     }, function (file) { openFile(file); });
+    $('#fileTreeFull').fileTree({ root: currentProject, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function (file) {
+        selectFile(file);
+    }, function (file) { openFile(file); });
     $("#info").append("Selection: " + base_path());
     /*setDetailBox();*/
 

slapos/runner/templates/layout.html

@@ -65,14 +65,16 @@
                 <div class="wmenu">
                     <ul>
                         <li><a href="{{ url_for('editSoftwareProfile') }}">Profiles</a></li>
+                        <li><a href="{{ url_for('browseWorkspace') }}">Workspace</a></li>
+                        <li class='sep'></li>
                         <li><a href="{{ url_for('runSoftwareProfile') }}" id="softrun">Run software</a></li>
                         <li><a href="{{ url_for('viewSoftwareLog') }}">Software log</a></li>
                         <li><a href="{{ url_for('inspectSoftware') }}">SR result</a></li>
+                        <li class='sep'></li>
                         <li><a href="{{ url_for('runInstanceProfile') }}" id="instrun">Run instance</a></li>
                         <li><a href="{{ url_for('viewInstanceLog') }}">Instance log</a></li>
                         <li><a href="{{ url_for('inspectInstance') }}">Inspect instance</a></li>
-                        <li><a id="removeIst" href="#">Remove instance</a></li>
-                        <li><a href="{{ url_for('browseWorkspace') }}">Workspace</a></li>
+                        <li><a id="removeIst" href="#">Destroy instance</a></li>
                     </ul>
                 </div>
                 <div class="clear"></div>

slapos/runner/templates/softwareFolder.html

@@ -25,6 +25,7 @@
     <div class="clear"></div>
     <div id="details_box">
   	  <div id="fileTree" class="file_tree_short" title="Double click to edit selected file..."></div>
+      <div id="fileTreeFull" style='display:none' class="file_tree_short" title="Double click to edit selected file..."></div>
     	<div class="box_software">
     	    <input type="text" name="file" id="file" size='12' value="Name here..." />
     	    &nbsp;<select name="type" id="type">