p05617423
/
bench4q
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

modify interface of plugin.jsp and script.jsp ,and alter plugin-new.js 

and plugin.css
This commit is contained in:
zhengyingying 2014-03-25 13:35:39 +08:00
parent 9ac50dda44
commit d8da4eae34
5 changed files with 188 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
Bench4Q-Web/src/main/webapp/bench4q-css/plugin.css
View File

@ -31,13 +31,25 @@ a:hover {
margin-left: 0px;
}
table, th, td,thead,tbody
/* table, th, tr, td,thead,tbody
{
border: 1px solid #FFE37E;
width:40px;
height:18px;
margin:5px,5px,5px,5px;
} */
td,th{
width:230px;
padding-top:5px;
padding-left:10px;
}
.table-margin{
margin-top:10px;
padding-top:5px;
padding-left:10px;
}
.sample_frame {
margin-bottom: 0px;
border: #3689BB solid thin;
@ -50,9 +62,22 @@ table, th, td,thead,tbody
margin-left: 10px;
margin-right: 10px;
padding-top:10px;
padding-left:10px;
padding-bottom:10px;
}
.btn-width {
width:80px;
}
.btn-large{
width:25%;
}
/* .cb-style{
padding-left:10px;
padding-bottom:10px;
} */
.listArea {
height: 340px;

18
Bench4Q-Web/src/main/webapp/plugin.jsp
View File

@ -103,15 +103,15 @@ body {
<div id="pluginArea" class="listArea span9"></div>
<div class=" span3 button-div">
<div>
<button type="submit" class="btn btn-inverse" id="addPlugin"
<button type="submit" class="btn btn-primary btn-width" id="addPlugin"
onClick="addPlugin();">Add</button>
</div>
<div>
<button type="submit" class="btn btn-inverse"
<button type="submit" class="btn btn-primary btn-width"
id="removePlugin" onClick="removePlugin();">Remove</button>
</div>
<div>
<button type="submit" class="btn btn-inverse"
<button type="submit" class="btn btn-primary btn-width"
id="removeAllPlugin" onClick="#">Remove all</button>
</div>
</div>
@ -137,11 +137,11 @@ body {
<div id="behaviorArea" class="listArea span9"></div>
<div class="span3 button-div">
<div>
<button type="submit" class="btn btn-inverse"
<button type="submit" class="btn btn-primary btn-width"
id="insertBehavior_Plugin" onClick="insertPlugin();">Insert</button>
</div>
<div>
<button type="submit" class="btn btn-inverse"
<button type="submit" class="btn btn-primary btn-width"
id="removeBehavior_Plugin" onClick="removeInsertPlugin();">Remove</button>
</div>
</div>
@ -178,9 +178,9 @@ body {
</div>
<div class="modal-footer">
<button type="button" class="btn btn-inverse"
<button type="button" class="btn btn-primary btn-width"
onClick="pluginFinish();" id="pluginFinish">Finish</button>
<button type="button" class="btn btn-inverse"
<button type="button" class="btn btn-primary btn-width"
onClick="pluginCancel();" id="pluginCancel">Cancel</button>
</div>
@ -206,9 +206,9 @@ body {
</div>
<div class="modal-footer">
<button type="button" class="btn btn-inverse"
<button type="button" class="btn btn-primary btn-width"
onClick="behaviorFinish();" id="behaviorFinish">Finish</button>
<button type="button" class="btn btn-inverse" onClick="#"
<button type="button" class="btn btn-primary btn-width" onClick="#"
id="behaviorCancel">Cancel</button>
</div>

2
Bench4Q-Web/src/main/webapp/script.jsp
View File

@ -129,7 +129,7 @@ body {
onclick="#" type="submit">自制脚本
</button>
<button id="refreshPage" class="btn btn-info "
<button id="refreshPage" class="btn btn-primary "
onclick="refresh()" type="submit">刷新页面
</button>
</td>

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

@ -9,6 +9,7 @@ var pluginList = new Array();
var index = 0;
$(document).ready(function() {
loadPluginList();
});
function loadPluginList() {
@ -18,10 +19,11 @@ function loadPluginList() {
return;
}
data = data.data;// List<String> pluginList
for ( var i = 0; i < data.length; i++) {
for (var i = 0; i < data.length; i++) {
pluginList.push(data[i]);
}
});
}
function getMethod(pluglin) {
@ -34,7 +36,7 @@ function getMethod(pluglin) {
return;
}
data = data.data;// List<String> methodList
for ( var i = 0; i < data.length; i++) {
for (var i = 0; i < data.length; i++) {
aMethodList.push(data[i]);
}
});
@ -43,9 +45,9 @@ function getMethod(pluglin) {
function addPlugin() {
var html = "";
for ( var j = 0; j < pluginList.length; j++) {
for (var j = 0; j < pluginList.length; j++) {
html += createLineWithRadio(pluginList[j],"plugin");
html += createLineWithRadio(pluginList[j], "plugin");
}
$('#choosePlugin').html(html);
$('#myModal_Plugin').modal('show');
@ -53,8 +55,14 @@ function addPlugin() {
$("input:radio").click(function() {
$(this).attr("checked", "checked");
});
// var pluginIndex = new HashMap();
// //初始化
// for(var i=0;i<pluginList.length;i++){
// pluginIndex.put(pluginList[i], 0);
// }
}
function createLineWithRadio(lineText,nameAttr) {
function createLineWithRadio(lineText, nameAttr) {
var textNode = document.createTextNode(lineText);
var divNode = document.createElement("div");
var inputNode = document.createElement("input");
@ -68,28 +76,28 @@ function createLineWithRadio(lineText,nameAttr) {
divNode.appendChild(brNode);
return $(divNode).html() + "<br>";
}
// 选中的plug-in list
function pluginFinish() {
$('#myModal_Plugin').modal('hide');
var pluginName;
// var pluginIndexNum=pluginIndex.get(item);
// alert("pluginIndexNum="+pluginIndexNum);
var item = $("input[type='radio']:checked").val();
pluginName = item + "_" + num;
pluginChoosedList.push(pluginName);
num++;
document.getElementById("pluginArea").innerHTML += createLine(pluginName);
}
function createLine(pluginName) {
var div = document.createElement("div");
var p = document.createElement("p");
var textNode = document.createTextNode(pluginName);
p.setAttribute("onClick", "showInsertPlugin(this)");// 引入的plugin
p.setAttribute("style", "cursor:pointer;float:left;");
p.appendChild(textNode);
div.appendChild(p);
return $(div).html();
}
function removePlugin() {
pluginChoosedList.pop();
var last = document.getElementById("pluginArea").lastChild;
@ -100,12 +108,18 @@ function insertPlugin() {
document.getElementById("pluginMethod").innerHTML = "";
$('#myModal_Behavior').modal('show');
var chooesedPluginHtml = "";
for ( var i = 0; i < pluginChoosedList.length; i++) {
chooesedPluginHtml += createLineWithRadio(pluginChoosedList[i],"plugin");
for (var i = 0; i < pluginChoosedList.length; i++) {
chooesedPluginHtml += createLineWithRadio(pluginChoosedList[i],
"plugin");
}
$("#insertPluginAreaPlugins").html(chooesedPluginHtml);
}
$('#insertPluginAreaPlugins').click(function() {
var item = $("input[type='radio']:checked").val();
showInsertPlugin(item);
});
function showInsertPlugin(pluginName) {
getMethodList(pluginName);
}
@ -121,7 +135,6 @@ function getMethodList(methodData) {
// plug-in.method列表
var plugin_method_List = new Array();
// 得到_前的内容
var type = methodData.split("_");
var plugin = type[0];
@ -133,48 +146,35 @@ function getMethodList(methodData) {
return;
}
data = data.data;// List<String> methodList
for ( var i = 0; i < data.length; i++) {
for (var i = 0; i < data.length; i++) {
plugin_method_List.push(methodData + "." + data[i]);// httpPlugin_0.post
methodList.push(data[i]);
methodHtml += createLineWithRadio(methodList[i],"method");
methodHtml += createLineWithRadio(methodList[i], "method");
}
// for ( var j = 0; j < methodList.length; j++) {
// var hideTextNode = document.createTextNode(plugin_method_List
// .valueOf(j));
// var hideNode = document.createElement("p");
// hideNode.setAttribute("class", "hide");
// hideNode.appendChild(hideTextNode);
//
// methodHtml += "<div id='" + plugin_method_List.valueOf(j)
// + "'><a style='cursor: pointer;' onClick='show(this);'>"
// + methodList[j] + "</a><p class='hide'>"
// + plugin_method_List.valueOf(j) + "</div>";
// }
document.getElementById("pluginMethod").innerHTML = methodHtml;
});
}
$('#insertPluginAreaPlugins').click(function() {
var item = $("input[type='radio']:checked").val();
showInsertPlugin(item);
});
function behaviorFinish(){
function behaviorFinish() {
var plugin = $("input[name='plugin']:checked").val();
var method = $("input[name='method']:checked").val();
show(plugin,method);
if (plugin != null && plugin != "" && method != null && method != "") {
show(plugin, method);
} else {
alert("The plugin or the method shouldn't be null!");
$('#myModal_Behavior').modal('hide');
}
}
function show(plugin,method) {
var behaviorData = plugin+"."+method;
function show(plugin, method) {
var behaviorData = plugin + "." + method;
$('#myModal_Behavior').modal('hide');
// 显示到showBehaviorsTable中
var div = document.createElement("div");
var a = document.createElement("a");
var textNode = document.createTextNode(behaviorData);
a.setAttribute("class", index);// 样式设计
a.setAttribute("class", index);
a.setAttribute("onClick", "showMethodDocument(this)");// loadMethodParams
a.setAttribute("style", "cursor:pointer;float:left;");
a.appendChild(textNode);
@ -191,7 +191,7 @@ function showMethodDocument(selectedNode) {
var div = $("#showPluginMethod").children();
$(div[behaviorIndex]).attr("class", "show");
$(div[behaviorIndex]).show();
for ( var i = 0; i < length; i++) {
for (var i = 0; i < length; i++) {
if (div[i].getAttribute("id") != behaviorIndex) {
$(div[i]).hide();
}
@ -220,10 +220,10 @@ function loadMethodParams(behaviorData, behaviorIndex) {
return;
}
data = data.data;
for ( var i = 0; i < data.length; i++) {
for (var i = 0; i < data.length; i++) {
methodParams.push(data[i]);
}
for ( var j = 0; j < methodParams.length; j++) {
for (var j = 0; j < methodParams.length; j++) {
var methodParamModel = new MethodParamModel(
methodParams[j].name,
methodParams[j].lable,
@ -232,7 +232,7 @@ function loadMethodParams(behaviorData, behaviorIndex) {
methodParams[j].paramType,
methodParams[j].methodParamProperties);
var methodParamProperties = new Array();
for ( var q = 0; q < methodParamModel.methodParamProperties.length; q++) {
for (var q = 0; q < methodParamModel.methodParamProperties.length; q++) {
var methodParamPropertyModel = new MethodParamPropertyModel(
methodParamModel.methodParamProperties[q].key,
methodParamModel.methodParamProperties[q].value);
@ -241,7 +241,7 @@ function loadMethodParams(behaviorData, behaviorIndex) {
}
var type = methodParamModel.paramType;
var size = 0, cols = "", rows = "";
for ( var p = 0; p < methodParamProperties.length; p++) {
for (var p = 0; p < methodParamProperties.length; p++) {
var methodParamProertyModel = methodParamProperties[p];
if (methodParamProertyModel.key == "size") {
size = methodParamProertyModel.value;
@ -271,27 +271,24 @@ function loadMethodParams(behaviorData, behaviorIndex) {
}
boxHeader = "<div class='box-header well' data-original-title> "
+ "<i class='icon-pencil' style='float:left'></i>"
+ "<i class='icon-pencil left'></i>"
+ "<h2>sample:<i>"
+ behaviorData
+ "</i></h2><div class='box-icon'><a class='btn btn-setting btn-round'>"
+ "<i class='icon-plus'></i></a><a class='btn btn-round'><i class='icon-list'></i></a>"
+ "<a class='btn btn-minimize btn-round'><i class='icon-chevron-up'></i></a></div></div>";
+ "</i></h2></div>";
documentHtml = "<div id='"
+ behaviorIndex
+ "' class='hide'><p class='hide'>"
+ behaviorData
+ "</p><div class='span10 showPluginDetails box'>"
+ "</p><div class='span11 box'>"
+ boxHeader
+ "<div class='box-content'>"
+ fieldHTML
+ "</div><div><button id='' type='submit' onClick='uploadBehavior(this);'>submit</button></div></div></div>";
+ "</div><div class='center'><button class='btn-large btn-primary' type='submit' onClick='uploadBehavior(this);'>submit</button></div></div></div>";
document.getElementById("showPluginMethod").innerHTML += documentHtml;
});
}
// 创建一个label加一个input的域
function createField(label, name, size, behaviorIndex) {
if (size == 0) {
size = 20;
@ -320,7 +317,6 @@ function createField(label, name, size, behaviorIndex) {
return $(result).html();
}
// 创建一个可以增加field的域
function createMultiField(label, name, size, behaviorIndex) {
if (size == 0) {
size = 20;
@ -333,7 +329,7 @@ function createMultiField(label, name, size, behaviorIndex) {
var addFieldButton = document.createElement("button");
var addFieldNode = document.createTextNode("Add Field");
var removeFieldButton = document.createElement("button");
var removeFieldNode = document.createTextNode("RemoveAll");
var removeFieldNode = document.createTextNode("Remove Field");
var br = document.createElement("br");
var table = document.createElement("table");
@ -341,11 +337,14 @@ function createMultiField(label, name, size, behaviorIndex) {
$(divNode).attr("id", behaviorIndex + "_" + name);
$(div).attr("class", "sample_sub_frame");
$(addFieldButton).attr("type", "submit");
$(addFieldButton).attr("class", "btn-large");
$(addFieldButton).attr("onClick",
"addField(" + size + "," + behaviorIndex + ");");
$(removeFieldButton).attr("type", "submit");
$(removeFieldButton).attr("class", "btn-large");
$(removeFieldButton).attr("onClick", "removeField(this)");
$(table).attr("id", "addFieldTable_" + behaviorIndex);
$(table).attr("class", "table-margin");
p.appendChild(labelNode);
addFieldButton.appendChild(addFieldNode);
@ -362,22 +361,20 @@ function createMultiField(label, name, size, behaviorIndex) {
var field;
function addField(size, addId) {
if (document.getElementById("addFieldTable_" + addId).childNodes.length == 0) {
field = 0;
}
field = $("#addFieldTable_" + addId).children().length;
var data = "field_" + field + ":";
field = field + 1;
var newTrNode = document.createElement("tr");
var newTdNode1 = document.createElement("td");
var newTdNode2 = document.createElement("td");
var newTdNode3 = document.createElement("td");
var i = document.createElement("i");
i.setAttribute("class", "icon-trash");
i.setAttribute("style", "cursor:pointer");
i.setAttribute("onClick", "deleteField(this)");
newTdNode1.setAttribute("style", "width:40px;cursor:pointer;");
// var newTdNode3 = document.createElement("td");
// var i = document.createElement("i");
// i.setAttribute("class", "icon-trash");
// i.setAttribute("style", "cursor:pointer");
// i.setAttribute("onClick", "deleteField(this)");
// newTdNode1.setAttribute("style", "width:40px;cursor:pointer;");
newTdNode1.setAttribute("class", data);
newTdNode2.setAttribute("style", "width:40px;");
// newTdNode2.setAttribute("style", "width:40px;");
var textNode = document.createTextNode(data);
var inputNode = document.createElement("input");
inputNode.setAttribute("type", "text");
@ -385,42 +382,33 @@ function addField(size, addId) {
newTdNode1.appendChild(textNode);
newTdNode2.appendChild(inputNode);
newTdNode3.appendChild(i);
// newTdNode3.appendChild(i);
newTrNode.appendChild(newTdNode1);
newTrNode.appendChild(newTdNode2);
newTrNode.appendChild(newTdNode3);
// newTrNode.appendChild(newTdNode3);
document.getElementById("addFieldTable_" + addId).appendChild(newTrNode);
}
function deleteField(selectedNode) {
var deletedNode = selectedNode.parentNode.parentNode;
var parentNode = deletedNode.parentNode;
parentNode.removeChild(deletedNode);
}
function removeField(selectedNode) {
var table = selectedNode.nextSibling.nextSibling;
var tableId = $(table).attr("id");
document.getElementById(tableId).innerHTML = "";
var deletedNode = table.lastChild;
table.removeChild(deletedNode);
}
// 创建一个Table域
function createTable(methodParamModel, cols, behaviorIndex) {
var name = methodParamModel.name;
var label = methodParamModel.lable;
var valueSeperator = methodParamModel.valueSeperator;
var table_content = cols.split(valueSeperator);
// 创建Table head
var tr = document.createElement("tr");
for ( var i = 0; i < table_content.length; i++) {
for (var i = 0; i < table_content.length; i++) {
var th = document.createElement("th");
var text = document.createTextNode(table_content[i]);
th.appendChild(text);
tr.appendChild(th);
}
// 创建一行
var tr_content = document.createElement("tr");
for ( var j = 0; j < table_content.length; j++) {
for (var j = 0; j < table_content.length; j++) {
var td_content = document.createElement("td");
var text_content = document.createElement("input");
text_content.setAttribute("type", "text");
@ -443,14 +431,17 @@ function createTable(methodParamModel, cols, behaviorIndex) {
var thead = document.createElement("thead");
var tbody = document.createElement("tbody");
divNode.setAttribute("class", "Table sample_frame");
divNode.setAttribute("id", behaviorIndex + "_" + name);
div.setAttribute("class", "sample_sub_frame");
addColButton.setAttribute("type", "submit");
addColButton.setAttribute("onClick", "addCol(this)");
removeColButton.setAttribute("type", "submit");
removeColButton.setAttribute("onClick", "removeCol(this)");
table.setAttribute("class", behaviorIndex + "_operateTableCols");
$(divNode).attr("class", "Table sample_frame");
$(divNode).attr("id", behaviorIndex + "_" + name);
$(div).attr("class", "sample_sub_frame");
$(addColButton).attr("type", "submit");
$(addColButton).attr("class", "btn-large");
$(addColButton).attr("onClick", "addCol(this)");
$(removeColButton).attr("type", "submit");
$(removeColButton).attr("class", "btn-large");
$(removeColButton).attr("onClick", "removeCol(this)");
$(table).attr("class", behaviorIndex + "_operateTableCols");
$(table).attr("class", "table-margin");
p.appendChild(labelNode);
addColButton.appendChild(addColNode);
@ -476,9 +467,10 @@ function addCol(selectedNode) {
var tbody = selectedNode.nextSibling.nextSibling.nextSibling.lastChild;
var length = tbody.previousSibling.firstChild.childNodes.length;
var tr = document.createElement("tr");
for ( var i = 0; i < length; i++) {
for (var i = 0; i < length; i++) {
var td = document.createElement("td");
var input = document.createElement("input");
input.setAttribute("type", "text");
td.appendChild(input);
tr.appendChild(td);
}
@ -506,12 +498,12 @@ function createCheckBox(methodParamModel, rows, behaviorIndex) {
var divInput = document.createElement("div");
var labelNode = document.createTextNode(label);
var nameNode = document.createTextNode(name + ":");
divNode.setAttribute("class", "CheckBox sample_frame");
divNode.setAttribute("id", "checkbox_" + name + "_" + behaviorIndex);
div.setAttribute("class", "sample_sub_frame");
$(divNode).attr("class", "CheckBox sample_frame");
$(divNode).attr("id", "checkbox_" + name + "_" + behaviorIndex);
$(div).attr("class", "sample_sub_frame");
$(divInput).attr("class", "sample_sub_frame");
p.appendChild(labelNode);
for ( var i = 0; i < cb_content.length; i++) {
for (var i = 0; i < cb_content.length; i++) {
var checkBoxNode = document.createElement("input");
var brInput = document.createElement("br");
checkBoxNode.setAttribute("type", "checkbox");
@ -559,14 +551,14 @@ function uploadBehavior(selectedNode) {
var tableList = "";
var checkList = "";
for ( var i = 0; i < length; i++) {
for (var i = 0; i < length; i++) {
var node = div[i];
if ($(node).attr("class") == "Field sample_frame") {
fieldList += $(node).find("input").val() + ",";
} else if ($(node).attr("class") == "MultiField sample_frame") {
var fieldNode = $(node).find("table").children();
var fieldLength = $(fieldNode).length;
for ( var j = 0; j < fieldLength; j++) {
for (var j = 0; j < fieldLength; j++) {
multiFieldList += $(fieldNode[j]).find("input").val() + ",";
}
} else if ($(node).attr("class") == "Table sample_frame") {
@ -575,8 +567,8 @@ function uploadBehavior(selectedNode) {
var row = table.find("tbody").children().length;
alert("col=" + col + ",row=" + row);
var tbody = $(node).find("tbody");
for ( var m = 0; m < row; m++) {
for ( var n = 0; n < col; n++) {
for (var m = 0; m < row; m++) {
for (var n = 0; n < col; n++) {
var rowNode = $(tbody).children()[m];
var colNode = $(rowNode).children()[n];
var value = $(colNode).find("input").val();

65
Bench4Q-Web/src/main/webapp/script/pluginModel.js
View File

@ -20,3 +20,68 @@ function UploadBehaviorRequestModel(tableList,checkList,fieldList,multiList){
this.fieldList=fieldList;
this.multiList=multiList;
}
function HashMap() {
this.arrKey = new Array();
this.arrValue = new Array();
// 检查Key是否存在
this.exists = function(strKey) {
strKey = strKey.toUpperCase();
for (var i = 0; i < this.arrKey.length; i++) {
if (this.arrKey[i] == strKey) {
return true;
}
}
return false;
};
this.length = function() {
return this.arrKey.length;
};
// 设置Key和Value
this.put = function(strKey, objValue) {
strKey = strKey.toUpperCase();
for (var i = 0; i < this.arrKey.length; i++) {
if (this.arrKey[i] == strKey) {
this.arrValue[i] = objValue;
return;
}
}
this.arrKey[this.arrKey.length] = strKey;
this.arrValue[this.arrValue.length] = objValue;
};
// 获取指定Key的Value，如果Key不存在，返回null
this.get = function(strKey) {
strKey = strKey.toUpperCase();
for (var i = 0; i < this.arrKey.length; i++) {
if (this.arrKey[i] == strKey) {
return this.arrValue[i];
}
}
return null;
};
// 删除一个Key
this.remove = function(strKey) {
strKey = strKey.toUpperCase();
for (var i = 0; i < this.arrKey.length; i++) {
if (this.arrKey[i] == strKey) {
this.arrKey.splice(i, 1);
this.arrValue.splice(i, 1);
return;
}
}
};
// 获取所有的Key数组
this.getKeys = function() {
return this.arrKey;
};
// 获取所有的Value数组
this.getValues = function() {
return this.arrValue;
};
}