add slapgrid process control and log management

slapos/runner/static/css/styles.css

-
-*
-{
-margin: 0px;
-padding: 0px;
-}
+*{margin: 0px;padding: 0px;}
 
 a{
     text-decoration: none;
     color: #19485C;
 }
 
-a:hover {	
+a:hover {
     color: #4DA0C6;
 }
 
@@ -36,7 +31,7 @@ th{
     border-right: 1px solid #A8A8A8;
     color: #4c6172;
     font-weight: normal;
-    font-size: 16px; 
+    font-size: 16px;
 }
 
 textarea {
@@ -47,12 +42,13 @@ body {
 	background: #7195c2 url('../images/cloud_bg.jpg') repeat-x;
 	font: 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
 	color: #000000;
+	font-size: normal;
 }
 
 #page
 {
-	margin: 5px auto;
-	width: 841px;        
+	margin: 20px auto;
+	width: 841px;
 }
 
 #logo{
@@ -66,18 +62,15 @@ body {
     background: url(../images/head.png) no-repeat;
 }
 
-.block_header{    
+.block_header{
     text-align: left;
     padding-left: 25px;
     height: 30px;
 }
 
-#header .text{
-    font-weight: bold;
-    font-size: 14px;
-    padding-top: 6px;
-    margin-left: 5px;
-    float: left;
+#header .run{
+    margin-right: 30px;
+    float: right;
 }
 
 #header .info{
@@ -85,7 +78,7 @@ body {
     font-weight: normal;
     padding-top: 3px;
     float: left;
-    width: 700px;
+    width: 690px;
     height: 22px;
     text-align: center;
     color: #4c6172;
@@ -98,22 +91,22 @@ body {
     background: #CAD4DC;
     height: 24px;
     float: left;
-    margin-top: 2px; 
+    margin-top: 2px;
     margin-right: 5px;
      margin-left:5px
 }
 
-#editor { 
-        margin: 0;
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
+#editor {
+    margin: 0;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
     }
 
 .wmenu{
-    
+
 }
 
 .wmenu ul{
@@ -166,7 +159,7 @@ body {
 
 
 .wmenu ul li a{
-    display:block;    
+    display:block;
     height: 20px;
     Color:#000;
     font-size:14px;
@@ -175,21 +168,21 @@ body {
     padding-left: 6px;
 }
 
-.wmenu ul li a:focus, .wmenu ul li a:hover, .wmenu ul li a.active{
+.wmenu ul li a:hover, .wmenu ul li a.active{
     color:#0271BF;
     background:url(../images/menu_hover.png) bottom repeat-x;
 }
 
 #main
-{    
+{
     background: url(../images/main_bg_all.png) repeat-y;
     padding-left: 24px;
-    padding-right: 24px;     
-    min-height: 400px;   
+    padding-right: 24px;
+    min-height: 400px;
 }
 
 .main_content{
-    position:relative;	
+    position:relative;
     width: 100%;
     height: 430px;
     margin-top:10px;
@@ -215,7 +208,7 @@ body {
 .content h2{
     color: #4c6172;
     font-weight: normal;
-    font-size: 18px;    
+    font-size: 18px;
 }
 .content h2 a{
     text-decoration:none;
@@ -274,6 +267,7 @@ body {
     color:#000;
     padding:5px;
     outline:none;
+    font: 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
 .idleField{
     background:#fff;
@@ -281,14 +275,19 @@ body {
     border: solid 1px #678dad;
     padding:5px;
     outline:none;
+    font: 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+input[type="radio"], input[type="checkbox"]{
+    margin: 4px;
 }
 
-.flash{		
+.flash{
     margin-left:20px;
     color:#4A131F;
     font-style:italic;
     font-size:14px;
-    position:relative;  
+    position:relative;
 }
 
 .flashes{
@@ -311,11 +310,11 @@ body {
 }
 
 #home_box{
-    background: none;    
+    background: none;
     border: 1px solid #678dad;
     padding: 0;
     height: 405px;
-    color: #4c6172;    
+    color: #4c6172;
     margin: 15px;
 }
 
@@ -377,7 +376,7 @@ body {
 
 .lmenu:hover, .smenu:hover, .sright_menu:hover{
     background: #96b9d7;
-    
+
 }
 
 .smenu{
@@ -393,7 +392,7 @@ body {
 }
 
 .sright_menu{
-    display: block;    
+    display: block;
     height: 80px;
     padding: 15px;
     border: #678dad;
@@ -479,6 +478,8 @@ body {
     background: #e4e4e4 url(../images/arrow_down.png) 97% 50% no-repeat;
 }
 
+.gradient{border:1px solid #D4D4D4;background-color:#f4f4f4;background:-moz-linear-gradient(#f4f4f4,#ececec);background:-webkit-linear-gradient(#f4f4f4,#ececec);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4',endColorstr='#ececec')";background:linear-gradient(#f4f4f4,#ececec);}
+
 h2.hight:hover{
     cursor: pointer;
 }
@@ -487,23 +488,25 @@ h2.hight:hover{
     padding: 10px;
 }
 
-.log_content{    
+.log_content{
     border: solid 1px #4c6172;
     padding: 2px;
 }
 
-.log {    
+.log {
     border: none;
-    background: #f6f7f8;   
+    background: #f6f7f8;
     color: #000;
     width: 754px;
     padding: 2px;
-    height: 600px;
+    height: 450px;
 }
+.log_btn{border: 1px solid #678dad; border-top:none; height: 22px; width: 654px; margin: 0 40px 10px 40px;
+    padding:4px 10px 4px 10px; font-size: 16px; color: #4c6172;}
 
 .waitting{
     margin-left: 10px;
-    display: none;    
+    display: none;
 }
 
 .file_info{
@@ -519,6 +522,7 @@ h2.hight:hover{
     margin-bottom: 9px;
     font-size: 14px;
     cursor:default;
+    word-wrap: break-word
 }
 
 #check{
@@ -533,7 +537,7 @@ h2.hight:hover{
     overflow: auto;
     height: 95px;
     padding: 5px;
-    width: 754px;
+    width: 604px;
     background:#fff;
     margin-bottom: 10px;
     color: #3A494F;
@@ -572,16 +576,17 @@ a.lshare{
     height: 18px;
     font-size: 15px;
     border: solid 1px #678dad;
-    color: #000;
+    color: #666666;
     margin-right: 10px;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     text-shadow: 0px 1px #F0F1F2;
+    text-align:center;
+    font-weight:bold;
 }
 
 a.lshare:hover{
     background:#D9D9D9 url(../images/button_highlight.png) 50% repeat-x;
-    color: #000;
     border:solid 1px #73A6FF;
 }
 a.lshare:focus{
@@ -592,12 +597,12 @@ a.lshare img{
     margin: 5px;
 }
 
-#error{        
+#error{
     padding: 0px;
-    position: absolute;    
+    position: absolute;
     top: -2px;
     left:0;
-    right: 0;    
+    right: 0;
 }
 
 #error > div{
@@ -617,7 +622,7 @@ a.lshare img{
     font-weight: normal;
 }
 #error table, #error th, #error tr, #error td{
-    border: none;    
+    border: none;
     padding:0;
 }
 
@@ -642,4 +647,31 @@ a.lshare img{
 #pClose{background:url(../images/close.png) no-repeat 0px 0px; display:block; width:22px; height:22px; cursor:pointer}
 #pClose:hover{background:url(../images/close_hover.png) no-repeat 0px 0px;}
 .md5sum {margin:10px; font-size:15px;}
-.title{background: #e4e4e4; width: 100%; height: 25px; padding-top:2px; text-indent: 5px; color: #737373; text-shadow: 0px 1px #FFF;}
+.title{background: #e4e4e4; width: 100%; height: 25px; padding-top:2px; text-indent: 5px; color: #737373; text-shadow: 0px 1px #FFF;}
\ No newline at end of file
+.clone-box-left{float:left; width: 120px; font-size:14px; background: #e4e4e4; padding:5px 0 5px 5px; margin-top:10px;
+    font-size:14px; border-radius: 4px 0 0 4px;}
+.clone-box-right{background: #e4e4e4; padding: 5px; float:right; width: 634px; margin-left: -5px;
+    margin-top:10px; box-shadow: 1px 1px 1px #888888;}
+.clone-box-left ul{margin:0px; list-style:none}
+.clone-box-left li{padding: 2px; padding-left:10px; padding-right:10px;}
+.clone-box-left li:hover{background:#F0F2F2; border-radius: 4px 0 0 4px;}
+.clone-box-left li.checked{background:#fff; border-radius: 4px 0 0 4px;}
+.clone-box-right h2{text-align:center}
+/* Bubble pop-up */
+.popup {position: absolute; display: none; z-index: 50;}
+.popup table, .popup td, .popup th{margin:0; padding:0; background:none; border:0; border-collapse:collapse;}
+.popup td.corner {height: 15px;width: 19px;}
+.popup td#topleft { background-image: url(../images/bubble-8.png); }
+.popup td.top { background-image: url(../images/bubble-7.png);}
+.popup td#topright { background-image: url(../images/bubble-6.png); }
+.popup td.left { background-image: url(../images/bubble-4.png); }
+.popup td.right { background-image: url(../images/bubble-5.png); }
+.popup td#bottomleft { background-image: url(../images/bubble-3.png); }
+.popup td.bottom { background-image: url(../images/bubble-2.png);}
+.popup td.top img { display: block; }
+.popup td#bottomright { background-image: url(../images/bubble-1.png); }
+.popup-contents {background: #fff; color: #666666;}
+.popup a{display: block; font-weight:bold;  color: #4DA0C6;}
+.popup a:hover{color: #666666;}
+.popup ul{margin:0; padding:0; list-style:none;}
+.popup li{border-bottom: 1px dashed #666666; padding:5px; padding-top:5px;}

slapos/runner/static/js/jquery/jqueryFileTree.js

@@ -14,7 +14,7 @@
 //           selectFolder   - if true, also return path of folder when event happen on it
 //
 if(jQuery) (function($){
-	
+
 	$.extend($.fn, {
 		fileTree: function(o, h, p) {
 			// Defaults
@@ -29,9 +29,9 @@ if(jQuery) (function($){
 			if( o.multiFolder == undefined ) o.multiFolder = true;
 			if( o.loadMessage == undefined ) o.loadMessage = 'Loading...';
 			if( o.selectFolder == undefined ) o.selectFolder = false;
-			
+
 			$(this).each( function() {
-				
+
 				function showTree(c, t) {
 					$(c).addClass('wait');
 					$(".jqueryFileTree.start").remove();
@@ -42,7 +42,7 @@ if(jQuery) (function($){
 						bindTree(c);
 					});
 				}
-				
+
 				function bindTree(t) {
 					$(t).find('LI A').bind(o.folderEvent, function() {
 						if( $(this).parent().hasClass('directory') ) {
@@ -55,18 +55,18 @@ if(jQuery) (function($){
 								$(this).parent().find('UL').remove(); // cleanup
 								showTree( $(this).parent(), escape($(this).attr('rel').match( /.*\// )) );
 								$(this).parent().removeClass('collapsed').addClass('expanded');
+									if(o.selectFolder){
+									h($(this).attr('rel'));
+								}
 							} else {
 								// Collapse
 								$(this).parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
 								$(this).parent().removeClass('expanded').addClass('collapsed');
 							}
-							if(o.selectFolder){
-								h($(this).attr('rel'));
-							}
 						} else {
 							h($(this).attr('rel'));
 						}
-						return false;
+
 					});
 					// Prevent A from triggering the # on non-click events
 					if( o.folderEvent.toLowerCase != 'click' ) $(t).find('LI A').bind('click', function() { return false; });
@@ -86,5 +86,5 @@ if(jQuery) (function($){
 			});
 		}
 	});
-	
+
 })(jQuery);
\ No newline at end of file

slapos/runner/static/js/scripts/common.js

+/*Common javascript function*/
+String.prototype.toHtmlChar = function(){
+  c = {'<':'&lt;', '>':'&gt;', '&':'&amp;', '"':'&quot;', "'":'&#039;',
+       '#':'&#035;' };
+  return this.replace( /[<&>'"#]/g, function(s) { return c[s]; } );
+}
+
+/**************************/

slapos/runner/static/js/scripts/cookies.js

+/*Cookies Management*/
+function setCookie(name,value,expires,path,domain,secure){
+  if (!expires){
+    var today = new Date();
+    expires = new Date(today.getTime() + 365 * 24 * 60 * 60 * 1000);
+  }
+  document.cookie = name + "=" + escape(value) +
+    "; expires=" + expires.toGMTString() +
+    ((path) ? "; path=" + path : "/") +
+    ((domain) ? "; domain=" + domain : "") +
+    ((secure) ? "; secure" : "");
+}
+function deleteCookie(name,path,domain) {
+  if (getCookie(name)) {
+    document.cookie = name + "=" +
+    ((path) ? "; path=" + path : "/") +
+    ((domain) ? "; domain=" + domain : "") +
+    "; expires=Thu, 01-Jan-70 00:00:01 GMT";
+  }
+}
+function getCookie(name) {
+  var i,x,y,ARRcookies=document.cookie.split(";");
+  for (i=0;i<ARRcookies.length;i++){
+    x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
+    y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
+    x=x.replace(/^\s+|\s+$/g,"");
+    if (x==name){
+      var result = unescape(y);
+      if (result != "" && result != null){
+        return result;
+      }
+      return null;
+    }
+  }
+  return null;
+}
+/**************************/

slapos/runner/static/js/scripts/editor.js

@@ -7,12 +7,14 @@ $(document).ready( function() {
 	editor.getSession().setTabSize(2);
 	editor.getSession().setUseSoftTabs(true);
 	editor.renderer.setHScrollBarAlwaysVisible(false);
-	    	
+	$("#editor").css("font-size", "14px");
+
 	var file = $("input#profile").val();
+	var workdir = $("input#workdir").val();
 	var edit = false;
 	var send = false;
 	selectFile(file);
-	
+
 	$("#save").click(function(){
 		if(!edit){
 			$("#error").Popup("Can not load your file, please make sure that you have selected a Software Release", {type:'alert', duration:5000});
@@ -24,7 +26,7 @@ $(document).ready( function() {
 			type: "POST",
 			url: $SCRIPT_ROOT + '/saveFileContent',
 			data: {file: file, content: editor.getSession().getValue()},
-			success: function(data){				
+			success: function(data){
 				if(data.code == 1){
 					$("#error").Popup("File Saved!", {type:'confirm', duration:2000});
 				}
@@ -40,14 +42,28 @@ $(document).ready( function() {
 		getmd5sum();
 		return false;
 	});
-	
+	$("#adddevelop").click(function(){
+	    var developList = new Array();
+	    var i=0;
+	    $("#plist li").each(function(index){
+		var elt = $(this).find("input:checkbox");
+		if (elt.is(":checked")){
+		    developList[i] = workdir+"/"+elt.val();
+		    i++;
+		    elt.attr("checked", false);
+		}
+	    });
+	    if (developList.length > 0){setDevelop(developList);}
+	    return false;
+	});
+
 	function selectFile(file){
 		edit = false;
 		$.ajax({
 			type: "POST",
 			url: $SCRIPT_ROOT + '/getFileContent',
 			data: "file=" + file,
-			success: function(data){	
+			success: function(data){
 				if(data.code == 1){
 					editor.getSession().setValue(data.result);
 					edit = true;
@@ -59,7 +75,7 @@ $(document).ready( function() {
 		});
 		return;
 	}
-	
+
 	function getmd5sum(){
 		if (send) return;
 		send =true
@@ -79,4 +95,33 @@ $(document).ready( function() {
 			}
 		});
 	}
+	function setDevelop(developList){
+	    if (developList==null || developList.length <= 0) return;
+	    editor.navigateFileStart();
+	    editor.find('buildout',{caseSensitive: true,wholeWord: true});
+	    if(!editor.getSelectionRange().isEmpty()){
+		//editor.find("",{caseSensitive: true,wholeWord: true,regExp: true});
+		//if(!editor.getSelectionRange().isEmpty()){
+			//alert("found");
+		//}
+		//else{alert("no found");
+		//}
+	    }
+	    else{
+		$("#error").Popup("Can not found part [buildout]! Please make sure that you have a cfg file", {type:'alert', duration:3000});
+		return;
+	    }
+	    editor.navigateLineEnd();
+	    $.post($SCRIPT_ROOT+"/getPath", {file:developList.join("#")}, function(data) {
+		    if(data.code==1){
+			var result = data.result.split('#');
+			editor.insert("\ndevelop =\n\t" + result[0] + "\n");
+			for(var i=1; i<result.length; i++)
+			    editor.insert("\t" + result[i] + "\n");
+		    }
+	    })
+	    .error(function() {  })
+	    .complete(function(){});
+	    editor.insert("\n");
+	}
 });
\ No newline at end of file

slapos/runner/static/js/scripts/folder.js

@@ -4,6 +4,16 @@ $(document).ready( function() {
 	$('#fileTree').fileTree({ root: $("input#workdir").val(), script: $SCRIPT_ROOT + '/readFolder', folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false }, function(file) { 
 		selectFile(file);
 	});
+	configRadio();
+	$("input#nothing").change(function(){
+		configRadio();
+	});
+	$("input#ssh").change(function(){
+		configRadio();
+	});
+	$("input#https").change(function(){
+		configRadio();
+	});
 	$("#clone").click(function(){
 		if(send){
 			cloneRequest.abort();
@@ -35,15 +45,41 @@ $(document).ready( function() {
 			}
 			email = $("input#email").val();
 		}
+		if($("input#https").is(':checked')){
+			if($("input#username").val() == "" || !$("input#username").val().match(/^[\w\d\._-]+$/)){
+				$("#error").Popup("Please enter a correct username", {type:'alert', duration:3000});
+				return false;
+			}
+			if($("input#password").val() != ""){
+				if(repo_url.indexOf("https://") != -1){
+					repo_url = "https://" + $("input#username").val() +
+						":" + $("input#password").val() +
+						"@" + repo_url.substring(8);
+				}
+				else{
+					$("#error").Popup("The URL of your repository should start with 'https://'", {type:'alert', duration:3000});
+					return false;
+				}
+			}
+			else{
+				$("#error").Popup("Please enter your password", {type:'alert', duration:3000});
+				return false;
+			}
+		}
+		else if(repo_url.indexOf("https://") != -1){
+			$("#error").Popup("Please select HTTPS Security Mode for this repository", {type:'alert', duration:3000});
+			return false;
+		}
 		$("#imgwaitting").fadeIn('normal');
 		$("#clone").empty();
 		$("#clone").append("Stop");
-		send = true;		
+		send = true;
 		cloneRequest = $.ajax({
 			type: "POST",
 			url: $SCRIPT_ROOT + '/cloneRepository',
-			data: "repo=" + repo_url + "&name=" + $("input#name").val() + "&email=" + email +
-				"&user=" + name,
+			data: {repo: repo_url, name: ($("input#workdir").val() + "/"
+				+ $("input#name").val()), email:email,
+				user:name},
 			success: function(data){
 				if(data.code == 1){
 					$("#file_navigation").fadeIn('normal');
@@ -64,7 +100,25 @@ $(document).ready( function() {
 			}
 		});
 		return false;
-	});	
+	});
+	function configRadio(){
+		$("#modelist li").each(function(index) {			
+			var boxselector = "#box" + index;
+			if($(this).hasClass('checked')){
+				$(this).removeClass('checked');				
+				$(boxselector).slideUp("normal");
+			}
+			if($(this).find("input:radio").is(':checked')){
+				$(this).addClass('checked');
+				//change content here
+				$(boxselector).slideDown("normal");
+			}
+			if(index != 2){
+				$("input#password").val("");
+				$("input#cpassword").val("");
+			}
+		});
+	}
 	
 	function selectFile(file){
 		//nothing

slapos/runner/static/js/scripts/inspectInstance.js

 $(document).ready( function() {
-  var basedir = $("input#basedir").val();
   var editor;
   setupFileTree();
 
@@ -17,11 +16,10 @@ $(document).ready( function() {
   
   function viewFile(file){
 	  //User have double click on file in to the fileTree
-	  var name = file.replace(basedir, "");
-	  loadFileContent(file, name);
+	  loadFileContent(file);
   }
 	
-  function loadFileContent(file, filename){
+  function loadFileContent(file){
   $.ajax({
 	type: "POST",
 	url: $SCRIPT_ROOT + '/checkFileType',
@@ -36,8 +34,8 @@ $(document).ready( function() {
 	      success: function(data){	
 		      if(data.code == 1){
 			$("#inline_content").empty();
-			$("#inline_content").append('<h2 style="color: #4c6172; font: 18px \'Helvetica Neue\', Helvetica, Arial, sans-serif;">Inspect Software Content: ' +
-				filename +'</h2>');
+			$("#inline_content").append('<h2 style="color: #4c6172; font: 18px \'Helvetica Neue\', Helvetica, Arial, sans-serif;">Inspect Instance Content: ' +
+				file +'</h2>');
 			$("#inline_content").append('<br/><div class="main_content"><pre id="editor"></pre></div>');
 			setupEditor();
 			$(".inline").colorbox({inline:true, width: "847px", onComplete:function(){						

slapos/runner/static/js/scripts/inspectSoftware.js

@@ -17,7 +17,7 @@ $(document).ready( function() {
 		return;
 	}
 	
-	function fillContent(selectedElt){
+	function fillContent(){
 		var folder = $("#softwarelist").val();
 		var elt = $("option:selected", $("#softwarelist"));
 		$('#fileTree').fileTree({ root: runnerDir + "/" + folder, script: $SCRIPT_ROOT + '/readFolder', 
@@ -32,7 +32,7 @@ $(document).ready( function() {
 		var elt = $("option:selected", $("#softwarelist"));
 		$.ajax({
 			type: "POST",
-			url: $SCRIPT_ROOT + '/setCurentProject',
+			url: $SCRIPT_ROOT + '/setCurrentProject',
 			data: "path=" + elt.attr('rel'),
 			success: function(data){
 				if(data.code == 1){

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

+//Global Traitment!!!
+var url = $SCRIPT_ROOT + "/slapgridResult"
+var currentState = false;
+var running = true;
+var $current;
+var processType = "";
+var currentProcess;
+var sendStop = false;
+var processState = "Checking"; //define slapgrid running state
+var openedlogpage = ""; //content software or instance if the current page is software or instance log, otherwise nothing
+var logReadingPosition = 0;
+var speed = 5000;
+var isRunning = function(){
+  if (running){
+    $("#error").Popup("Slapgrid is currently under execution!", {type:'alert', duration:3000});
+  }
+  return running;
+}
+function setSpeed(value){
+  if (openedlogpage == ""){
+    speed = 5000;
+  }
+  else{ speed=value;}
+}
+function getRunningState(){
+  var param = {position:logReadingPosition, log:(processState!="Checking" && openedlogpage==processType.toLowerCase())? openedlogpage:""}
+  var jqxhr = $.post(url, param, function(data) {
+      setRunningState(data)
+      logReadingPosition = data.content.position;
+      if(data.content.content != ""){
+        $("#salpgridLog").append(data.content.content.toHtmlChar());
+        $("#salpgridLog")
+        .scrollTop($("#salpgridLog")[0].scrollHeight - $("#salpgridLog")
+          .height());
+      }
+      processState = (running && processState != "Running")?"Running":"Stopped";
+  })
+  .error(function() { clearAll(false); })
+  .complete(function() {
+    if (running){
+      setTimeout(function(){
+        getRunningState();
+      }, speed);
+    }
+  });
+}
+function clearAll(setStop){
+  currentState = false;
+  running = setStop;
+}
+function bindRun(){
+  $("#softrun").click(function(){
+    if($("#softrun").text() == "Stop"){
+      stopProcess();
+    }
+    else{
+      if(!isRunning()){
+        setCookie("slapgridCMD", "Software");
+        location.href = $SCRIPT_ROOT + "/viewSoftwareLog";
+      }
+    }
+    return false;
+  });
+  $("#instrun").click(function(){
+    if($("#instrun").text() == "Stop"){
+      stopProcess();
+    }
+    else{
+      if(!isRunning()){
+        setCookie("slapgridCMD", "Instance");
+        location.href = $SCRIPT_ROOT + "/viewInstanceLog";
+      }
+    }
+    return false;
+  });
+}
+function setRunningState(data){
+  if (data.result){
+    if(!currentState){
+      $("#running").show();
+      running = true;
+      //change run menu title and style
+      if(data.software){
+        $("#softrun").empty();
+        $("#softrun").append("Stop");
+        $("#softrun").css("color", "#0271BF");
+        $current = $("#softrun");
+        processType = "Software";
+      }
+      if(data.instance){
+        $("#instrun").empty();
+        $("#instrun").append("Stop");
+        $("#instrun").css("color", "#0271BF");
+        $current = $("#instrun");
+        processType = "Instance";
+      }
+    }
+  }
+  else{
+    $("#running").hide();
+    running = false; //nothing is currently running
+    if ($current != undefined){
+      $current.empty();
+      $current.append("Run");
+      $current.css("color", "#000");
+      $current = undefined;
+      currentState = false;
+      $("#error").Popup("Successfully run " + processType + " Profile", {type:'info', duration:3000});
+    }
+  }
+  currentState = data.result;
+}
+function runProcess(urlfor, data){
+  if(!isRunning()){
+    running = true;
+    processState = "Running";
+    currentProcess = $.post(urlfor)
+    .error(function() {
+      $("#error").Popup("Failled to run Slapgrid", {type:'error', duration:3000}); });
+    setRunningState(data);
+    setTimeout("getRunningState()", 5000);
+  }
+}
+function stopProcess(){
+  if (sendStop) return;
+  if (running){
+    sendStop = true;
+    var urlfor = $SCRIPT_ROOT + "stopSlapgrid"
+    var type = "slapgrid-sr.pid";
+    if($("#instrun").text() == "Stop"){
+      type = "slapgrid-cp.pid";
+    }
+    $.post(urlfor, {type:type}, function(data){
+      //if (data.result){
+        //$("#error").Popup("Failled to run Slapgrid", {type:'error', duration:3000}); });
+      //}
+    })
+    .error(function() {
+      $("#error").Popup("Failled to stop Slapgrid process", {type:'error', duration:3000}); })
+    .complete(function() {sendStop = false;processState="Stopped";});
+  }
+}
+
+function checkSavedCmd(){
+  var result = getCookie("slapgridCMD");
+  if (!result) return false;
+  if (result == "Software"){
+    running = false;
+    runProcess(($SCRIPT_ROOT + "/runSoftwareProfile"),
+      {result: true, instance:false, software:true});
+  }
+  else if(result == "Instance"){
+    running = false;
+    runProcess(($SCRIPT_ROOT + "/runInstanceProfile"),
+      {result: true, instance:true, software:false});
+  }
+  deleteCookie("slapgridCMD");
+  return (result != null);
+}
\ No newline at end of file

slapos/runner/static/js/scripts/project.js

@@ -45,7 +45,7 @@ $(document).ready( function() {
 		}
 		$.ajax({
 			type: "POST",
-			url: $SCRIPT_ROOT + '/setCurentProject',
+			url: $SCRIPT_ROOT + '/setCurrentProject',
 			data: "path=" + $("input#path").val(),
 			success: function(data){
 				if(data.code == 1){
@@ -60,20 +60,19 @@ $(document).ready( function() {
 	});
 	
 	function selectFile(file){
-		var relativeFile = file.replace(workdir, "");
 		$("#info").empty();		
 		$("input#subfolder").val(file);
 		path = "";
 		if(method == "open"){
-			$("#info").append("Selection: " + relativeFile);
+			$("#info").append("Selection: " + file);
 			checkFolder(file);
 		}
 		else{
 			if($("input#software").val() != "" && $("input#software").val().match(/^[\w\d._-]+$/)){
-				$("#info").append("New Software in: " + relativeFile + $("input#software").val());
+				$("#info").append("New Software in: " + file + $("input#software").val());
 			}
 			else{
-				$("#info").append("Selection: " + relativeFile);
+				$("#info").append("Selection: " + file);
 			}
 		}
 		return;

slapos/runner/static/js/scripts/repo.js

@@ -2,7 +2,7 @@ $(document).ready( function() {
 	var send = false;
 	var getStatus;
 	gitStatus();
-	$("#project").change(function(){		
+	$("#project").change(function(){
 		if (send){
 			getStatus.abort();
 			send=false;
@@ -27,9 +27,9 @@ $(document).ready( function() {
 		});
 	});
 	$("#addbranch").click(function(){
-		if($("input#branchname").val() == "" || 
+		if($("input#branchname").val() == "" ||
 			$("input#branchname").val() == "Enter the branch name..."){
-			$("#error").Popup("Please Enter your branch name", {type:'alert', duration:3000});
+			$("#error").Popup("Please Enter the new branch name", {type:'alert', duration:3000});
 			return false;
 		}
 		var project = $("#project").val();
@@ -37,10 +37,34 @@ $(document).ready( function() {
 		$.ajax({
 			type: "POST",
 			url: $SCRIPT_ROOT + '/newBranch',
-			data: "project=" + $("input#workdir").val() + "/" + project + "&name=" + branch,
+			data: {project:$("input#workdir").val() + "/" + project, name:branch, create:'1'},
 			success: function(data){
 				if(data.code == 1){
-					$("input#branchname").val("");
+					$("input#branchname").val("Enter the branch name...");
+					gitStatus();
+				}
+				else{
+					$("#error").Popup(data.result, {type:'error'});
+				}
+			}
+		});
+		return false;
+	});
+	$("#docheckout").click(function(){
+		if($("input#checkout").val() == "" ||
+			$("input#checkout").val() == "Existing branch name..."){
+			$("#error").Popup("Please Enter your branch name", {type:'alert', duration:3000});
+			return false;
+		}
+		var project = $("#project").val();
+		var branch = $("input#checkout").val();
+		$.ajax({
+			type: "POST",
+			url: $SCRIPT_ROOT + '/newBranch',
+			data: {project:$("input#workdir").val() + "/" + project, name:branch, create:'0'},
+			success: function(data){
+				if(data.code == 1){
+					$("input#checkout").val("Existing branch name...");
 					gitStatus();
 				}
 				else{
@@ -56,7 +80,7 @@ $(document).ready( function() {
 			$("#error").Popup("Please Enter the commit message", {type:'alert', duration:3000});
 			return false;
 		}
-		if (send){ 
+		if (send){
 			return false;
 		}
 		send = true;
@@ -84,13 +108,13 @@ $(document).ready( function() {
 				$("#commit").empty();
 				$("#commit").attr("value", "Commit");
 				send = false;
-			}			
+			}
 		});
 		return false;
 	});
 	/*
 	$("#pullbranch").click(function(){
-		if (send){ 
+		if (send){
 			return false;
 		}
 		send = true;
@@ -124,7 +148,7 @@ $(document).ready( function() {
 	});*/
 	function gitStatus(){
 		var project = $("#project").val();
-		$("#status").empty();			
+		$("#status").empty();
 		$("#push").hide();
 		$("#flash").empty();
 		if (project == ""){
@@ -141,16 +165,16 @@ $(document).ready( function() {
 			success: function(data){
 				if(data.code == 1){
 					$("#branchlist").show();
-					$("#status").append("<h2>Your Repository status</h2>");					
+					$("#status").append("<h2>Your Repository status</h2>");
 					message = data.result.split('\n').join('<br/>');
 					//alert(message);
-					$("#status").append("<p>" + message + "</p>");									
+					$("#status").append("<p>" + message + "</p>");
 					if(data.dirty){
 						$("#push").show();
 						$("#status").append("<br/><h2>Display Diff for current Project</h2>");
-						$("#status").append("<p style='font-size:15px;'>You have changes in your project." + 
+						$("#status").append("<p style='font-size:15px;'>You have changes in your project." +
 							" <a href='" + $SCRIPT_ROOT + "/getProjectDiff/"
-							+ encodeURI(project) + "'>Watch the diff</a></p>");	
+							+ encodeURI(project) + "'>Watch the diff</a></p>");
 					}
 					loadBranch(data.branch);
 				}

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

@@ -7,7 +7,8 @@ $(document).ready( function() {
 	editor.getSession().setTabSize(2);
 	editor.getSession().setUseSoftTabs(true);
 	editor.renderer.setHScrollBarAlwaysVisible(false);
-	    
+	$("#editor").css("font-size", "14px");
+
 	var script = "/readFolder";
 	var softwareDisplay = true;
 	var Mode = function(name, desc, clazz, extensions) {
@@ -16,10 +17,10 @@ $(document).ready( function() {
 		this.clazz = clazz;
 		this.mode = new clazz();
 		this.mode.name = name;
-		
+
 		this.extRe = new RegExp("^.*\\.(" + extensions.join("|") + ")$");
 	};
-	var modes = [		
+	var modes = [
 		new Mode("php", "PHP",require("ace/mode/php").Mode, ["php", "in", "inc"]),
 		new Mode("python", "Python", require("ace/mode/python").Mode, ["py"]),
 		new Mode("buildout", "Python Buildout config", require("ace/mode/buildout").Mode, ["cfg"])
@@ -28,15 +29,15 @@ $(document).ready( function() {
 	var workdir = $("input#workdir").val();
 	var currentProject = workdir + "/" + projectDir.replace(workdir, "").split('/')[1];
 	var send = false;
-	var edit = false;	
-	$('#fileTree').fileTree({ root: projectDir, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) { 
+	var edit = false;
+	$('#fileTree').fileTree({ root: projectDir, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) {
 		selectFile(file);
 	});
 	setDetailBox();
 	$("#add").click(function(){
 		var path = (softwareDisplay)? projectDir:currentProject;
 		if (send) return false;
-		if($("input#file").val() == "" || 
+		if($("input#file").val() == "" ||
 			$("input#file").val() == "Enter name here..."){
 			$("#error").Popup("Please enter your file or folder name", {type:'alert', duration:3000});
 			return false;
@@ -50,7 +51,7 @@ $(document).ready( function() {
 			type: "POST",
 			url: $SCRIPT_ROOT + '/createFile',
 			data: "file=" + path + "&type=" + $("#type").val(),
-			success: function(data){				
+			success: function(data){
 				if(data.code == 1){
 					switchContent();
 					$("input#file").val("");
@@ -58,7 +59,7 @@ $(document).ready( function() {
 					$("#flash").empty();
 					$("#info").empty();
 					$("#info").append("Select parent directory or nothing for root...");
-					$("input#subfolder").val("");					
+					$("input#subfolder").val("");
 				}
 				else{
 					$("#error").Popup(data.result, {type:'error', duration:5000});
@@ -68,7 +69,7 @@ $(document).ready( function() {
 		});
 		return false;
 	});
-	
+
 	$("#save").click(function(){
 		if(!edit){
 			$("#error").Popup("Please select the file to edit", {type:'alert', duration:3000});
@@ -80,7 +81,7 @@ $(document).ready( function() {
 			type: "POST",
 			url: $SCRIPT_ROOT + '/saveFileContent',
 			data: {file: $("input#subfolder").val(), content: editor.getSession().getValue()},
-			success: function(data){				
+			success: function(data){
 				if(data.code == 1){
 					$("#error").Popup("File saved succefuly!", {type:'confirm', duration:3000});
 				}
@@ -92,28 +93,47 @@ $(document).ready( function() {
 		});
 		return false;
 	});
-	
+
 	$("#details_head").click(function(){
 	    setDetailBox();
 	});
-	
+
 	$("#switch").click(function(){
 	    softwareDisplay = !softwareDisplay;
 	    switchContent();
 	    return false;
 	});
-	
+	$("#getmd5").click(function(){
+		getmd5sum();
+		return false;
+	});
+
 	$("#clearselect").click(function(){
 	    $("#info").empty();
-	    $("#info").append("Select parent directory or nothing for root...");
+	    $("#info").append("Select directory or nothing for root directory...");
 	    $("input#subfolder").val("");
 	    $("#edit_info").empty();
 	    $("#edit_info").append("No file selected");
 	    editor.getSession().setValue("");
 	    $("#md5sum").empty();
+	    $("a#option").hide();
 	    return false;
 	});
-	
+	$("#adddevelop").click(function(){
+	    var developList = new Array();
+	    var i=0;
+	    $("#plist li").each(function(index){
+		var elt = $(this).find("input:checkbox");
+		if (elt.is(":checked")){
+		    developList[i] = workdir+"/"+elt.val();
+		    i++;
+		    elt.attr("checked", false);
+		}
+	    });
+	    if (developList.length > 0){setDevelop(developList);}
+	    return false;
+	});
+
 	function getmd5sum(){
 		var file = $("input#subfolder").val();
 		if (send) return;
@@ -134,7 +154,7 @@ $(document).ready( function() {
 			}
 		});
 	}
-	
+
 	function switchContent(){
 	    var root = projectDir;
 	    if(!softwareDisplay){
@@ -144,16 +164,16 @@ $(document).ready( function() {
 	    }
 	    else{
 		$("#switch").empty();
-		$("#switch").append("Switch to Project files");		
+		$("#switch").append("Switch to Project files");
 	    }
-	    $('#fileTree').fileTree({ root: root, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) { 
+	    $('#fileTree').fileTree({ root: root, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) {
 	        selectFile(file);
 	    });
 	    $("#info").empty();
-	    $("#info").append("Select parent directory or nothing for root...");
+	    $("#info").append("Select directory or nothing for root directory...");
 	    $("input#subfolder").val("");
 	}
-	
+
 	function setDetailBox(){
 	    var state = $("#details_box").css("display");
 	    if (state == "none"){
@@ -167,34 +187,34 @@ $(document).ready( function() {
 		$("#details_head").addClass("hide");
 	    }
 	}
-	
+
 	function selectFile(file){
-		relativeFile = file.replace(workdir, "");
 		$("#info").empty();
-		$("#info").append(relativeFile);
+		$("#info").append(file);
 		$("input#subfolder").val(file);
 		$("#md5sum").empty();
 		path = "";
 		send = false;
 		edit = false;
-		if(file.substr(-1) != "/"){			
+		if(file.substr(-1) != "/"){
 			$.ajax({
 			type: "POST",
 			url: $SCRIPT_ROOT + '/getFileContent',
-			data: "file=" + file,
-			success: function(data){				
+			data: {file: file},
+			success: function(data){
 				if(data.code == 1){
-					md5link = " <a href='#' id='getmd5' title='Show or Update md5sum value'>[md5]</a>"
 					$("#edit_info").empty();
 					var name = file.split('/');
+					if(file.length > 65){
+						//substring title.
+						var start = file.length - 65;
+						file = "..." + file.substring(file.indexOf("/", (start + 1)));
+					}
 					$("#edit_info").append("Current file: " +
-						relativeFile + md5link);
+						file);
+					$("a#option").show();
 					editor.getSession().setValue(data.result);
 					setEditMode(name[name.length - 1]);
-					$("#getmd5").click(function(){
-						getmd5sum();
-						return false;
-					});
 					edit = true;
 				}
 				else{
@@ -207,13 +227,14 @@ $(document).ready( function() {
 		else{
 			$("#edit_info").empty();
 			$("#edit_info").append("No file selected");
+			$("a#option").hide();
 			editor.getSession().setValue("");
 		}
 		return;
 	}
-	
+
 	function setEditMode(file){
-		var CurentMode = require("ace/mode/text").Mode;		
+		var CurentMode = require("ace/mode/text").Mode;
 		editor.getSession().setMode(new CurentMode());
 		for (var i=0; i< modes.length; i++){
 			if(modes[i].extRe.test(file)){
@@ -223,4 +244,33 @@ $(document).ready( function() {
 			}
 		}
 	}
+	function setDevelop(developList){
+	    if (developList==null || developList.length <= 0) return;
+	    editor.navigateFileStart();
+	    editor.find('buildout',{caseSensitive: true,wholeWord: true});
+	    if(!editor.getSelectionRange().isEmpty()){
+		//editor.find("",{caseSensitive: true,wholeWord: true,regExp: true});
+		//if(!editor.getSelectionRange().isEmpty()){
+			//alert("found");
+		//}
+		//else{alert("no found");
+		//}
+	    }
+	    else{
+		$("#error").Popup("Can not found part [buildout]! Please make sure that you have a cfg file", {type:'alert', duration:3000});
+		return;
+	    }
+	    editor.navigateLineEnd();
+	    $.post($SCRIPT_ROOT+"/getPath", {file:developList.join("#")}, function(data) {
+		    if(data.code==1){
+			var result = data.result.split('#');
+			editor.insert("\ndevelop =\n\t" + result[0] + "\n");
+			for(var i=1; i<result.length; i++)
+			    editor.insert("\t" + result[i] + "\n");
+		    }
+	    })
+	    .error(function() {  })
+	    .complete(function(){});
+	    editor.insert("\n");
+	}
 });
\ No newline at end of file

slapos/runner/static/js/scripts/viewlog.js

+$(document).ready( function() {
+  openedlogpage = $("input#type").val();
+  updatelogBox();
+  var state = getCookie("autoUpdate");
+
+  $("#logheader").click(function(){
+    setupBox();
+  });
+  $("#manual").change(function(){
+    setCookie("autoUpdate", "manual");
+    if ($("input#type").val() == "instance"){location.href = $SCRIPT_ROOT + "/viewInstanceLog";}
+    else{location.href = $SCRIPT_ROOT + "/viewSoftwareLog";}
+  });
+  $("#live").change(function(){
+    updatelogBox();$("#logconfigbox").find("input:radio").attr('checked', false);$("#live").attr('checked', true);
+    setSpeed(500);setCookie("autoUpdate", "live");openedlogpage = $("input#type").val();});
+  $("#slow").change(function(){
+    updatelogBox();$("#logconfigbox").find("input:radio").attr('checked', false);$("#slow").attr('checked', true);
+    setSpeed(5000);setCookie("autoUpdate", "slow");openedlogpage = $("input#type").val();});
+  if(state){
+    $("#"+state).attr('checked', true);
+    updatelogBox();
+    if (state == "manual"){
+      openedlogpage = ""; setSpeed(0);
+    }
+    else{setSpeed((state=="live")?500:5000);}
+  }
+  else{$("#slow").attr('checked', true);}
+
+  function setupBox(){
+    var state = $("#logconfigbox").css("display");
+    if (state == "none"){
+      $("#logconfigbox").slideDown("normal");
+      $("#logheader").removeClass("hide");
+      $("#logheader").addClass("show");
+    }
+    else{
+      $("#logconfigbox").slideUp("normal");
+      $("#logheader").removeClass("show");
+      $("#logheader").addClass("hide");
+    }
+  }
+
+  function updatelogBox(){
+    if(processState=="Stopped" || processState=="Checking" || $("#manual").is(":checked")){
+      $("#salpgridLog").hide();
+      $("#manualLog").show();
+      $("#manualLog")
+        .scrollTop($("#manualLog")[0].scrollHeight - $("#manualLog")
+          .height());
+    }
+    else{
+      $("#salpgridLog").show();
+      $("#manualLog").hide();
+    }
+  }
+});
\ No newline at end of file

slapos/runner/templates/index.html

@@ -4,8 +4,8 @@
 <div id="home_box">
 <div class="inner_box">
 <div class="lmenu">
-    <h2><a href="{{ url_for('configRepo')}}">Create a new Project from your repository</a></h2>
-    <p>Your repository will be cloned into your project folder, you will need the url of the repository. 
+    <h2><a href="{{ url_for('configRepo')}}">Clone an Repository into your local Workspace</a></h2>
+    <p>Your repository will be cloned into your project folder, you will need the url of the repository.
     This allows you to open and edit your local project copy and synchonize content with online repository.
     </p>
     <img src="{{ url_for('static', filename='images/folder_html.png') }}" />
@@ -18,15 +18,15 @@
     <div class="clear"></div>
 </div>
 <div class="sright_menu">
-    <h2><a href="{{ url_for('manageProject')}}">Manage your Projects</a></h2>
-    <p>You can view details of all projects and commit your Software Release here.</p>
+    <h2><a href="{{ url_for('manageProject')}}">Manage Repositories</a></h2>
+    <p>You can view details of all repositories and commit your Software Release here.</p>
     <img src="{{ url_for('static', filename='images/manage_repo.png') }}" />
 </div>
 <div class="clear"></div>
 <div class="lmenu">
     <h2><a href="{{ url_for('openProject', method='new')}}">Create your new Software Release</a></h2>
     <p>To create a new Software Release, choose the project directory in which you want to create your software. You will then be able to edit and
-    run the new software on SlapOs, using webrunner tools.
+    run the new software release on SlapOS using slapgrid.
     </p>
     <img src="{{ url_for('static', filename='images/folder_blue.png') }}" />
     <div class="clear"></div>

slapos/runner/templates/instanceInspect.html

@@ -14,7 +14,6 @@
 {% endblock %}
 {% block body %}
 <input type='hidden' name='root' id='root' value='{%if file_path != "" %}{{file_path}}{%endif%}' />
-<input type='hidden' name='basedir' id='basedir' value='{{base_dir}}' />
 <h2>Instance inspection</h2><br/>
 <div id="tabContaier">
     <ul>
@@ -24,7 +23,7 @@
     </ul><!-- //Tab buttons -->
     <div class="tabDetails">
     	<div id="tab1" class="tabContents">
-	    <p>This tab show all process generated by slapgrid for your application. You can click on the process name to display logs.</p>
+	    <p>This tab show all process generated by slapgrid for your application. You can click on the process name to display log.</p>
 	    {% if supervisor != []%}
 	    <table cellpadding="0" cellspacing="0" width="100%">
 	      <tr>
@@ -40,7 +39,7 @@
 	    {% endfor %}
 	    </table>
 	    {% else %}
-	    <h2>Please run the software instance before displaying process</h2>
+	    <h2>No process to display, please run your instance</h2>
 	    {%endif%}
         </div><!-- end tab1 -->
     	<div id="tab2" class="tabContents">

slapos/runner/templates/layout.html

@@ -15,15 +15,19 @@
         <link href="{{ url_for('static', filename='css/styles.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
         <script src="{{ url_for('static', filename='js/jquery/jquery-1.6.2.min.js') }}" type="text/javascript" charset="utf-8"></script>
 	<script src="{{ url_for('static', filename='js/jquery/popup.js') }}" type="text/javascript" charset="utf-8"></script>
+	<script src="{{ url_for('static', filename='js/jquery/jqueryToolTip.js') }}" type="text/javascript" charset="utf-8"></script>
         <script type=text/javascript>
           $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
         </script>
+	<script src="{{ url_for('static', filename='js/scripts/process.js') }}" type="text/javascript" charset="utf-8"></script>
+	<script src="{{ url_for('static', filename='js/scripts/cookies.js') }}" type="text/javascript" charset="utf-8"></script>
+	<script src="{{ url_for('static', filename='js/scripts/common.js') }}" type="text/javascript" charset="utf-8"></script>
         <script type="text/javascript">
 		$(document).ready(function() {
 			$('input[type="text"]').addClass("idleField");
        		$('input[type="text"]').focus(function() {
        			$(this).removeClass("idleField").addClass("focusField");
-    		    if (this.value == this.defaultValue){ 
+    		    if (this.value == this.defaultValue){
     		    	this.value = '';
 				}
 				if(this.value != this.defaultValue){
@@ -35,41 +39,47 @@
     		    if ($.trim(this.value) == ''){
 			    	this.value = (this.defaultValue ? this.defaultValue : '');
 				}
-    		});		
+    		});
 		if($("input#fmsg").val() != ""){
-		   $("#error").Popup($("input#fmsg").val(), {type:'info', duration:10000, load:true});
+		   $("#error").Popup($("input#fmsg").val(), {type:'info', duration:5000, load:true});
+		}
+		bindRun();
+		if(!checkSavedCmd()){
+		    getRunningState();
 		}
-		});		
+		});
 	</script>
 	{% endblock %}
     </head>
     <body>
 	<div id="error"></div>
-        <div id="page">	    
+        <div id="page">
 	    <input type="hidden" name="fmsg" value="{{ get_flashed_messages()[0] }}" id="fmsg" />
-            <div id="logo">
-                <a href="{{ url_for('home') }}"><img src="{{ url_for('static', filename='images/logo.png') }}" alt="" /></a>
-            </div>
+            <!--<div id="logo">-->
+                <!--<a href="{{ url_for('home') }}"><img src="{{ url_for('static', filename='images/logo.png') }}" alt="" /></a>-->
+            <!--</div>-->
             <div id="header">
                 <div class="block_header">
                     <a href="{{ url_for('home') }}" style="float:left;" title="Home"><img alt="" src="{{ url_for('static', filename='images/home.png') }}" /></a>
 		    <div class="line"></div>
-		    <a href="{{ url_for('curentSoftware') }}" style="float:left" title="Edit current software release"><img alt="" src="{{ url_for('static', filename='images/project.png') }}" /></a>
+		    <a href="{{ url_for('editCurrentProject') }}" style="float:left" title="Edit your current project"><img alt="" src="{{ url_for('static', filename='images/project.png') }}" /></a>
 		    <div class="line"></div>
                     <h2 class="info">{% block title %}{% endblock %} - {{session.title}}</h2>
+		    <div class="run"><span id="running" style="display:none"><img alt="" src="{{ url_for('static', filename='images/ajax_roller.gif') }}"
+			height='26' title="slapgrid is currently running"/></span></div>
                 </div>
                 <div class="wmenu">
                     <ul>
                         <li><span class="title_software">Software</span></li>
                         <li><a href="{{ url_for('editSoftwareProfile') }}">Edit</a></li>
-                        <li><a href="{{ url_for('runSoftwareProfile') }}">Run</a></li>
+                        <li><a href="{{ url_for('runSoftwareProfile') }}" id="softrun">Run</a></li>
                         <li><a href="{{ url_for('viewSoftwareLog') }}">Build log</a></li>
                         <li><a href="{{ url_for('inspectSoftware') }}">Inspect</a></li>
                         <li><a href="{{ url_for('removeSoftware') }}">Remove</a></li>
 
                         <li class="space"><span class="title_instance">Instance</span></li>
                         <li><a href="{{ url_for('editInstanceProfile') }}">Edit</a></li>
-                        <li><a href="{{ url_for('runInstanceProfile') }}">Run</a></li>
+                        <li><a href="{{ url_for('runInstanceProfile') }}" id="instrun">Run</a></li>
                         <li><a href="{{ url_for('viewInstanceLog') }}">Build log</a></li>
                         <li><a href="{{ url_for('inspectInstance') }}">Inspect</a></li>
                         <li><a href="{{ url_for('stopAllPartition') }}">Stop all</a></li>
@@ -77,7 +87,7 @@
                     </ul>
                 </div>
                 <div class="clear"></div>
-            </div>            
+            </div>
             <div id="main">
                 <div {% if request.path == '/' %} class="home_content" {%else%} id="content" {% endif %}>
                     {% if request.path != '/' %}

slapos/runner/templates/processTail.html

 {% extends "layout.html" %}
 {% block title %}Log for {{ process }}{% endblock %}
 {% block body %}
-<h2>Displaying log for {{ process }}</h2><br/>
-<textarea cols=103 rows=40 readonly>{{ process_log }}</textarea>
+<h2 class='title'>Supervisord tail for "{{ process }}"</h2><br/>
+<textarea cols=103 rows=30 readonly style="background:#000; color:#fff;">{{ process_log }}</textarea>
 {% endblock %}

slapos/runner/templates/projectFolder.html

@@ -14,7 +14,7 @@
 <input type="hidden" name="method" id="method" value="{{method}}" />
 {% if method == "new" %}
 <div id="addsoftware">
-<h2>What is the name of your software release?</h2>
+<h2>Create your software release</h2>
 <label for='software'>Name: </label>
 <input type="text" name="software" id="software" size='30' value="Enter software name..." />
 <br/><br/>
@@ -23,7 +23,7 @@
 	<div id="fileTree" class="file_tree"></div>
 	<div id="file_info" class="file_info"><span id="info">Please select your parent folder into the box...</span></div>
 	<br/>
-	<input type="submit" name="create" id ="create" value="Start Project" class="button"/>
+	<input type="submit" name="create" id ="create" value="Create" class="button"/>
 </div>
 </div>
 {% elif method == "open" %}

slapos/runner/templates/runResult.html

@@ -3,13 +3,13 @@
 {% block head %}
   {{ super() }}
   <link href="{{ url_for('static', filename='css/jqueryFileTree.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
-  <script src="{{ url_for('static', filename='js/jquery/jqueryFileTree.js') }}" type="text/javascript" charset="utf-8"></script>  
+  <script src="{{ url_for('static', filename='js/jquery/jqueryFileTree.js') }}" type="text/javascript" charset="utf-8"></script>
   <script src="{{ url_for('static', filename='js/ace/ace-uncompressed.js') }}" type="text/javascript" charset="utf-8"></script>
   <script src="{{ url_for('static', filename='js/ace/theme-crimson_editor.js') }}" type="text/javascript" charset="utf-8"></script>
   <script src="{{ url_for('static', filename='js/scripts/inspectSoftware.js') }}" type="text/javascript" charset="utf-8"></script>
   <link href="{{ url_for('static', filename='css/colorbox.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
   <script src="{{ url_for('static', filename='js/jquery/jquery.colorbox-min.js') }}" type="text/javascript" charset="utf-8"></script>
-  
+
 {% endblock %}
 {% block body %}
 <h2>Inspect software</h2>
@@ -23,8 +23,6 @@
 &nbsp;&nbsp;<button id ="delete" class="button" title="Remove this software">Remove</button>
 &nbsp;&nbsp;<button id ="open" class="button" title="Set this software as current software release">Open</button>
 <br/><br/>
-<p><strong><u>Notes:</u> </strong> You can open any software release in the list by cliking on the "Open" button. Now compiling this software will take a very short time</p>
-<br/>
 <h2 id="softcontent">No content to displays</h2>
 <div id="fileTree" class="file_tree" style='height:200px;'></div>
 <div id="file_info" class="file_info">

slapos/runner/templates/viewLog.html

 {% extends "layout.html" %}
 {% block title %}View {{ type }} log{% endblock %}
+{% block head %}
+  {{ super() }}
+  <script src="{{ url_for('static', filename='js/scripts/viewlog.js') }}" type="text/javascript" charset="utf-8"></script>
+{% endblock %}
 {% block body %}
-<strong>Note:</strong> You can refresh this page from time to time to have updates.<br>
-<h2>Currently running: <span class="message">{{ running }}</span></h2><br>
-<h2>Result for {{ type }}</h2>
-<div class="log_content"><textarea class="log" readonly >{{ result }}</textarea></div>
+<input type="hidden" name="type" value="{{type}}" id="type" />
+<h2 class="hight hide" id="logheader">Slapgrid result for {{ type }}</h2>
+<div class="log_btn" id="logconfigbox" style="display:none">
+<span style="margin-left:15px; font-size: 18px;"> Update parameters </span>
+&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<input type="radio" name="liveupdate" id="manual" value="manual" />
+<label for="manual">Manualy update</label>&nbsp;
+<input type="radio" name="liveupdate" id="live" value="live" />
+<label for="live">Live update</label>&nbsp;
+<input type="radio" name="liveupdate" id="slow" value="slow" />
+<label for="slow">From time to time</label>
+</div>
+<br/>
+<div class="log_content"><textarea class="log" readonly id="salpgridLog"></textarea>
+<textarea class="log" readonly id="manualLog" style="display:none">{{result}}</textarea></div>
 {% endblock %}