rewrite editScript.js and modify interfaces

Bench4Q-Web/src/main/webapp/plugin.jsp

@@ -9,12 +9,12 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description"
 	content="Bench4Q, a new method for QOS benchmarking.">
-<title>Create scripts by yourself.</title>
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
-<!-- The styles -->
-
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css"
-	rel="stylesheet">
 <link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
+	rel="stylesheet">
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
 <style type="text/css">
 body {
 	padding-bottom: 40px;
@@ -25,6 +25,7 @@ body {
 }
 </style>
 <link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
+<link href="css/bench4q.css" rel="stylesheet">
 <link href='css/plugin.css' rel='stylesheet'>
 <link rel="shortcut icon" href="images/bench4q.png">
 <!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->

Bench4Q-Web/src/main/webapp/script-edit.jsp

@@ -6,16 +6,24 @@
 <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
 <meta charset="utf-8">
 <title>Bench4Q</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description"
 	content="Bench4Q, a new method for QOS benchmarking.">
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css"
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
+<link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
 	rel="stylesheet">
-<style type="text/css">
-</style>
 <link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
+<link rel="shortcut icon" href="image/bench4q.png">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
+	rel="stylesheet">
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
+<link href='lib/chrisma/css/opa-icons.css' rel='stylesheet'>
 <link href='lib/jsoneditor/css/jsoneditor.css' rel='stylesheet'>
-<link href='bench4q-css/editor.css' rel='stylesheet'>
+<link href='css/editor.css' rel='stylesheet'>
-<link rel="shortcut icon" href="images/bench4q.png">
+
 <!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
 <!--[if lt IE 9]>
 	  <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
@@ -284,6 +292,19 @@
 							</div>
 						</div>
 					</div>
+					<div class="span10 row-fluid">
+						<div class="span4 chooseScript" >
+							<p>UsePlugins:</p> <select name="usePlugins" id="usePlugins" onchange=" choosePlugin();">
+								 <option >please choose one plug-in</option>
+							</select>
+						</div>
+						<div class="span4 chooseScript" >
+							<p>Behaviors:</p> <select name="behaviors" id="behaviors" onchange="chooseBehavior();">
+								<!-- <option value="send">Send -->
+							</select>
+						</div>
+					</div>
+					<div id="showPluginMethodForm"></div>
 				</div>
 			</div>
 
@@ -326,9 +347,11 @@
 		<script src="lib/ace/js/mode-json.js"></script>
 		<script src="lib/ace/js/theme-textmate.js"></script>
 		<script src="lib/ace/js/theme-jsoneditor.js"></script>
-		<script src="script/jsonEditorApp.js"></script>
-		<script src="script/editScript.js"></script>
 		<script src="script/base.js"></script>
+		<script src="script/jsonEditorApp.js"></script>
+		<script src="script/behaviorsForm.js"></script>
+		<script src="script/pluginModel.js"></script>
+		<script src="script/editScript.js"></script>
 	</fmt:bundle>
 </body>
 </html>

Bench4Q-Web/src/main/webapp/script.jsp

@@ -9,15 +9,13 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description"
 	content="Bench4Q, a new method for QOS benchmarking.">
-
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css"
-	rel="stylesheet">
 <link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
-<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
 <link
-	href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/redmond/jquery-ui.css"
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
 	rel="stylesheet">
-
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
+<link href="css/bench4q.css" rel="stylesheet">
 <link rel="shortcut icon" href="images/bench4q.png">
 <style type="text/css">
 body {

Bench4Q-Web/src/main/webapp/script/editScript.js

@@ -0,0 +1,256 @@
+var pluginNameList = new Array();
+var parameters = new HashMap();
+var parameterList = new HashMap();
+var pluginName;
+function loadUsePluigns(data) {
+	for (var i = 0; i < data.usePlugins.length; i++) {
+		var usePlugin = data.usePlugins[i];
+		pluginNameList.push(usePlugin.id);
+	}
+	var selectNode = document.getElementsByName("usePlugins")[0];
+	for (var j = 0; j < pluginNameList.length; j++) {
+		var textNode = document.createTextNode(pluginNameList[j]);
+		var optionNode = document.createElement("option");
+		optionNode.setAttribute("value", pluginNameList[j]);
+		optionNode.appendChild(textNode);
+		selectNode.appendChild(optionNode);
+	}
+}
+
+function choosePlugin() {
+	var plugin = document.getElementById("usePlugins");
+	if (plugin.options[plugin.selectedIndex].value != 0) {
+		pluginName = plugin.options[plugin.selectedIndex].value;
+	}
+	loadBehaviors();
+}
+var clickScriptId;
+function chooseBehavior() {
+	var behaviorMethod = 0;
+	var behaviors = document.getElementById("behaviors");
+	if (behaviors.options[behaviors.selectedIndex].value != 0) {
+		behaviorMethod = behaviors.options[behaviors.selectedIndex].value;
+	}
+	document.getElementById("showPluginMethodForm").innerHTML = "";
+	var plugin_id = behaviorMethod.split("_")[0];
+	var behavior_id = behaviorMethod.split("_")[1];
+	clickScriptId = plugin_id + "_" + behavior_id;
+	loadFormParameters(plugin_id, behavior_id);
+
+}
+
+function loadBehaviors() {
+	$('#behaviors').html("");
+	var selectNode = document.getElementsByName("behaviors")[0];
+	var text = document.createTextNode("Please choose one behavior");
+	var option = document.createElement("option");
+	option.appendChild(text);
+	selectNode.appendChild(option);
+	$.each(modelData.pages, function(i, item) {
+		$.each(item.batches, function(i, item) {
+			var id = item.Id;
+			$.each(item.behaviors, function(i, item) {
+				if (item.use == pluginName) {
+					var textNode = document.createTextNode(item.use + "_" + id
+							+ "." + item.name + "_" + item.id);
+					var optionNode = document.createElement("option");
+					optionNode.setAttribute("value", id + "_" + item.id);
+					optionNode.appendChild(textNode);
+					selectNode.appendChild(optionNode);
+				}
+			});
+		});
+	});
+}
+
+function loadFormParameters(plugin_id, behavior_id) {
+	var plugin = "", method = "";
+	$.each(modelData.pages, function(i, item) {
+		$.each(item.batches, function(i, item) {
+			if (item.Id == plugin_id) {
+				$.each(item.behaviors, function(i, item) {
+					if (item.id == behavior_id) {
+						plugin = item.use;
+						method = item.name;
+						$.each(item.parameters, function(i, item) {
+							parameters.put(item.key, item.value);
+						});
+					}
+				});
+			}
+		});
+	});
+	loadMethodParameters(plugin, method, plugin_id, behavior_id);
+}
+
+function loadMethodParameters(plugin, method, plugin_id, behavior_id) {
+	var behaviorData = plugin + "_" + plugin_id + "." + method + "_"
+			+ behavior_id;
+	var behaviorIndex = /*plugin_id+"_"+*/ behavior_id;
+	$
+			.post(
+					"loadMethodParameters",
+					{
+						pluginName : plugin,
+						methodName : method
+					},
+					function(data) {
+						if (!data.success) {
+							alert(data.failedMessage);
+							return;
+						}
+						data = data.data;
+
+						var documentHtml = "";
+						var boxHeader = "";
+						var fieldHTML = createBehaviorsForm(data, behaviorData,
+								behaviorIndex);
+						boxHeader = "<div class='box-header well' data-original-title> "
+								+ "<i class='icon-pencil left'></i>"
+								+ "<h2>sample:<i>"
+								+ behaviorData
+								+ "</i></h2></div>";
+
+						documentHtml = "<div id='"
+								+ behaviorIndex
+								+ "' class=''><p class='hide'>"
+								+ behaviorData
+								+ "</p><div class='span10 box' style='margin-left:15px;'>"
+								+ boxHeader + "<div class='box-content'>"
+								+ fieldHTML + "</div></div></div>";
+						document.getElementById("showPluginMethodForm").innerHTML += documentHtml;
+						createForm(behaviorIndex);
+					});
+}
+
+function createForm(behaviorIndex) {
+	var formNode = document.getElementById(behaviorIndex);
+	var contents = formNode.lastChild.lastChild.childNodes;
+	var contentLength = contents.length;
+	for (var j = 0; j < contentLength; j++) {
+		var type = $(contents[j]).attr("class");
+		if (type == "Field sample_frame") {
+			var key = contents[j].lastChild.firstChild.nodeValue;
+			var value = parameters.get(key);
+			if (value != "" && value != null) {
+				$(contents[j].lastChild.lastChild).val(value);
+			}
+		} else if (type == "MultiField sample_frame") {
+			var key = contents[j].firstChild.firstChild.nodeValue.split(":")[0];
+			var value = parameters.get(key);
+			if (!(value == "" || value == null)) {
+				value = value.split(";");
+				var fieldLength = value.length;
+				for (var t = 0; t < fieldLength; t++) {
+					addField(20, behaviorIndex);
+					$($(contents[j]).find("table").children()[t]).find("input")
+							.val(value[t]);
+				}
+			}
+
+		} else if (type == "Table sample_frame") {
+			var key = contents[j].lastChild.firstChild.nodeValue;
+			var value = parameters.get(key);
+			if (value != "" && value != null) {
+				value = parameters.get(key).split("|;");
+				var table = $(contents[j]).find("table");
+				var col = table.find("th").length;
+				var row = value.length - 1;
+				var tbody = $(contents[j]).find("tbody");
+				for (var m = 0; m < row; m++) {
+					var input = value[m].split("|");
+					if (m != 0) {
+						var selectedNode = contents[j].lastChild.firstChild.nextSibling.nextSibling;
+						addCol(selectedNode);
+					}
+					for (var n = 0; n < col; n++) {
+						var rowNode = $(tbody).children()[m];
+						var colNode = $(rowNode).children()[n];
+						$(colNode).find("input").val(input[n]);
+					}
+				}
+			}
+		}
+	}
+}
+function saveFormModification() {
+	var div = document.getElementById("showPluginMethodForm").firstChild;
+	var plugin_method = div.firstChild.firstChild.nodeValue.split(".");
+	var pluginId = plugin_method[0].split("_")[1];
+	var behaviorId = plugin_method[1].split("_")[1];
+	var contents = div.lastChild.lastChild.childNodes;
+	var length = contents.length;
+	for (var i = 0; i < length; i++) {
+		var node = contents[i];
+		var key = "", value = "", temp = "";
+		if ($(node).attr("class") == "Field sample_frame") {
+			key = node.lastChild.firstChild.nodeValue;
+			temp = $(node).find("input").val();
+			if (temp != "") {
+				value = temp;
+			}
+		} else if ($(node).attr("class") == "MultiField sample_frame") {
+			key = node.firstChild.firstChild.nodeValue.split(":")[0];
+			var fieldNode = $(node).find("table").children();
+			var fieldLength = $(fieldNode).length;
+			for (var j = 0; j < fieldLength; j++) {
+				temp = $(fieldNode[j]).find("input").val();
+				if (temp != "") {
+					value += temp;
+				}
+				if (j != fieldLength - 1) {
+					value += ";";
+				}
+			}
+		} else if ($(node).attr("class") == "Table sample_frame") {
+			key = node.lastChild.firstChild.nodeValue;
+			var table = $(node).find("table");
+			var col = table.find("th").length;
+			var row = table.find("tbody").children().length;
+			var tbody = $(node).find("tbody");
+			for (var m = 0; m < row; m++) {
+				for (var n = 0; n < col; n++) {
+					var rowNode = $(tbody).children()[m];
+					var colNode = $(rowNode).children()[n];
+					temp = $(colNode).find("input").val();
+					if (temp != "") {
+						value += temp + "|";
+					}
+				}
+				if (value != "") {
+					value += ";";
+				}
+			}
+		} else if ($(node).attr("class") == "CheckBox sample_frame") {
+			key = node.lastChild.firstChild.nodeValue;
+			var id = $(node).attr("id");
+			$('input[name=' + id + ']:checked').each(function() {
+				temp = $(this).val();
+				if (temp != "") {
+					value += temp + ";";
+				}
+			});
+		}
+		parameterList.put(key, value);
+	}
+	modifyJsonData(pluginId, behaviorId);
+}
+
+function modifyJsonData(pluginId, behaviorId) {
+	for(var i=0;i<parameterList.length();i++){
+		alert("key="+parameterList.getKeys()[i]+",value="+parameterList.getValues()[i]);
+	}
+	$.each(modelData.pages, function(i, item) {
+		$.each(item.batches, function(i, item) {
+			if (item.Id == pluginId) {
+				$.each(item.behaviors, function(i, item) {
+					if (item.id == behaviorId) {
+						$.each(item.parameters, function(i, item) {
+							item.value = parameterList.get(item.key);
+						});
+					}
+				});
+			}
+		});
+	});
+}

Bench4Q-Web/src/main/webapp/script/jsonEditorApp.js

@@ -51,8 +51,6 @@ editor.load = function(scriptId) {
 			codeEditor = new jsoneditor.JSONEditor(codeContainer, options);
 			codeEditor.set(data);
 			loadUsePluigns(data);
-			/*loadBehaviors(data);*/
-			//alert(data.pages.length);
 		}, "json");
 
 		var $submit = $("#submit");
@@ -72,6 +70,8 @@ editor.load = function(scriptId) {
 		alert(p);
 	}
 }, editor.save = function() {
+	saveFormModification();
+	codeEditor.set(modelData);
 	if (codeEditor != null) {
 		var script = codeEditor.get();
 		$.ajax({

Bench4Q-Web/src/main/webapp/script/plugin-new.js

@@ -346,7 +346,7 @@ function saveBehavior(selectedNode) {
 	use = plugin_method[0].split("_")[0];
 	if (use == "timer") {
 		type = "TIMERBEHAVIOR";
-	} else {
+	} else if(use=="http"){
 		type = "USERBEHAVIOR";
 	}
 	var parameters = new Array();

Bench4Q-Web/src/main/webapp/test.jsp

@@ -9,9 +9,12 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description"
 	content="Bench4Q, a new method for QOS benchmarking.">
-
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css"
+<link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
 	rel="stylesheet">
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
 <style type="text/css">
 body {
 	padding-bottom: 40px;

Bench4Q-Web/src/main/webapp/testPlanTask.jsp

@@ -6,9 +6,15 @@
 <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
 <meta charset="utf-8">
 <title>Bench4Q</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="description"
 	content="Bench4Q, a new method for QOS benchmarking.">
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
+<link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
+	rel="stylesheet">
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
 <style type="text/css">
 body {
 	padding-bottom: 40px;

Bench4Q-Web/src/main/webapp/testplans.jsp

@@ -4,10 +4,17 @@
 <html>
 <head>
 <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
-<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<meta charset="utf-8">
 <title>Bench4Q</title>
-<link id="bs-css" href="lib/chrisma/css/bootstrap-cerulean.css"
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="description"
+	content="Bench4Q, a new method for QOS benchmarking.">
+<link href="lib/chrisma/css/bootstrap-cerulean.css" rel="stylesheet">
+<link href="lib/chrisma/css/opa-icons.css" rel="stylesheet">
+<link
+	href="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/css/bootstrap-responsive.css"
 	rel="stylesheet">
+<link href="lib/chrisma/css/charisma-app.css" rel="stylesheet">
 <style type="text/css">
 body {
 	padding-bottom: 40px;