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;
@@ -47,11 +42,12 @@ 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;
+	margin: 20px auto;
 	width: 841px;
 }
 
@@ -72,12 +68,9 @@ body {
     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;
@@ -175,7 +168,7 @@ 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;
 }
@@ -274,6 +267,7 @@ body {
     color:#000;
     padding:5px;
     outline:none;
+    font: 13px 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
 .idleField{
     background:#fff;
@@ -281,6 +275,11 @@ 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{
@@ -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;
 }
@@ -498,8 +499,10 @@ h2.hight:hover{
     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;
@@ -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{
@@ -643,3 +648,30 @@ a.lshare img{
 #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;}
+.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

@@ -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; });

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,8 +7,10 @@ $(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);
@@ -40,6 +42,20 @@ $(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;
@@ -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,6 +45,31 @@ $(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");
@@ -42,8 +77,9 @@ $(document).ready( function() {
 		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');
@@ -65,6 +101,24 @@ $(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

@@ -29,7 +29,7 @@ $(document).ready( function() {
 	$("#addbranch").click(function(){
 		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("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#branchname").val("");
+					$("input#checkout").val("Existing branch name...");
 					gitStatus();
 				}
 				else{

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

@@ -7,6 +7,7 @@ $(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;
@@ -102,15 +103,34 @@ $(document).ready( function() {
 	    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;
 	});
 
@@ -150,7 +170,7 @@ $(document).ready( function() {
 	        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("");
 	}
 
@@ -169,9 +189,8 @@ $(document).ready( function() {
 	}
 
 	function selectFile(file){
-		relativeFile = file.replace(workdir, "");
 		$("#info").empty();
-		$("#info").append(relativeFile);
+		$("#info").append(file);
 		$("input#subfolder").val(file);
 		$("#md5sum").empty();
 		path = "";
@@ -181,20 +200,21 @@ $(document).ready( function() {
 			$.ajax({
 			type: "POST",
 			url: $SCRIPT_ROOT + '/getFileContent',
-			data: "file=" + file,
+			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,6 +227,7 @@ $(document).ready( function() {
 		else{
 			$("#edit_info").empty();
 			$("#edit_info").append("No file selected");
+			$("a#option").hide();
 			editor.getSession().setValue("");
 		}
 		return;
@@ -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,7 +4,7 @@
 <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>
+    <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>
@@ -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,9 +15,13 @@
         <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");
@@ -37,7 +41,11 @@
 				}
     		});
 		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>
@@ -47,29 +55,31 @@
 	<div id="error"></div>
         <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>

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

@@ -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 %}