refactor plugin js
This commit is contained in:
parent
9a7af057c1
commit
6110e4eba8
|
|
@ -1,6 +1,7 @@
|
|||
package org.bench4q.web.api;
|
||||
|
||||
import java.util.ArrayList;
|
||||
import java.util.HashMap;
|
||||
import java.util.List;
|
||||
import java.util.Map;
|
||||
|
||||
|
|
@ -13,7 +14,10 @@ import org.bench4q.share.models.master.plugin.BehaviorInfoModel;
|
|||
import org.bench4q.share.models.master.plugin.PluginResponseModel;
|
||||
import org.bench4q.share.models.master.plugin.PluginUIModel;
|
||||
import org.bench4q.web.exception.CustomGenericException;
|
||||
import org.bench4q.web.masterMessager.PluginMessager;
|
||||
import org.bench4q.web.model.BaseResponseModel;
|
||||
import org.bench4q.web.newapi.BaseController;
|
||||
import org.bench4q.web.newservice.PluginService;
|
||||
import org.bench4q.web.service.BaseService;
|
||||
import org.bench4q.web.service.CommunicateWithMaster;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
|
|
@ -25,15 +29,19 @@ import org.springframework.web.bind.annotation.RequestParam;
|
|||
import org.springframework.web.bind.annotation.ResponseBody;
|
||||
import org.springframework.web.bind.annotation.SessionAttributes;
|
||||
import org.springframework.web.multipart.commons.CommonsMultipartFile;
|
||||
import org.bench4q.web.newservice.PluginService;
|
||||
|
||||
@Controller
|
||||
@SessionAttributes({ "accessToken" })
|
||||
public class PluginActionController {
|
||||
public class PluginActionController extends BaseController {
|
||||
|
||||
private PluginMessager pluginMessager;
|
||||
private final String baseUrl = "plugin";
|
||||
private final String BASECALLER = "PluginActionController:";
|
||||
private CommunicateWithMaster communicateWithMaster;
|
||||
|
||||
private PluginService pluginService;
|
||||
|
||||
public CommunicateWithMaster getCommunicateWithMaster() {
|
||||
return communicateWithMaster;
|
||||
}
|
||||
|
|
@ -44,6 +52,24 @@ public class PluginActionController {
|
|||
this.communicateWithMaster = communicateWithMaster;
|
||||
}
|
||||
|
||||
public PluginMessager getPluginMessager() {
|
||||
return pluginMessager;
|
||||
}
|
||||
|
||||
@Autowired
|
||||
public void setPluginMessager(PluginMessager pluginMessager) {
|
||||
this.pluginMessager = pluginMessager;
|
||||
}
|
||||
|
||||
public PluginService getPluginService() {
|
||||
return pluginService;
|
||||
}
|
||||
|
||||
@Autowired
|
||||
public void setPluginService(PluginService pluginService) {
|
||||
this.pluginService = pluginService;
|
||||
}
|
||||
|
||||
public String getBaseUrl() {
|
||||
return baseUrl;
|
||||
}
|
||||
|
|
@ -85,9 +111,28 @@ public class PluginActionController {
|
|||
}
|
||||
}
|
||||
|
||||
@RequestMapping("loadPluginInfos")
|
||||
@ResponseBody
|
||||
public Map<String, Object> loadPluginInfos(
|
||||
@ModelAttribute("accessToken") String accessToken) {
|
||||
Map<String, Object> map = new HashMap<String, Object>();
|
||||
PluginResponseModel pluginResponseModel = this.getPluginMessager()
|
||||
.loadPluginUIModels(accessToken);
|
||||
if (!pluginResponseModel.isSuccess()) {
|
||||
return fail(map, pluginResponseModel.getFailMessage());
|
||||
} else {
|
||||
|
||||
map = success(map);
|
||||
map.put("pluginInfos", this.getPluginService()
|
||||
.extractPluginInfoModels(pluginResponseModel));
|
||||
return map;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@RequestMapping("loadPluginUIList")
|
||||
public @ResponseBody
|
||||
BaseResponseModel loadPluginUIInfo(HttpServletRequest request,
|
||||
BaseResponseModel loadPluginUIInfo(
|
||||
@ModelAttribute("accessToken") String accessToken)
|
||||
throws CustomGenericException {
|
||||
System.out.println("loadPluginUIList");
|
||||
|
|
@ -105,7 +150,7 @@ public class PluginActionController {
|
|||
System.out.println("pluginUIModels is empty");
|
||||
}
|
||||
Logger.getLogger(PluginActionController.class).info(
|
||||
pluginResponseModel.isSuccess());
|
||||
pluginResponseModel.isSuccess());
|
||||
return new BaseResponseModel(true, pluginUIModels);
|
||||
} else {
|
||||
return new BaseResponseModel(false,
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import java.util.Map;
|
|||
|
||||
public abstract class BaseController {
|
||||
private final String SUCCESS = "success";
|
||||
private final String FAILMESSAGE = "failMessage";
|
||||
private final String FAILMESSAGE = "failedMessage";
|
||||
protected final String SERVER_ERROR = "server error";
|
||||
|
||||
protected Map<String, Object> fail(Map<String, Object> map, String message) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
package org.bench4q.web.newservice;
|
||||
|
||||
import java.util.LinkedList;
|
||||
import java.util.List;
|
||||
|
||||
import org.bench4q.share.models.master.plugin.PluginInfoModel;
|
||||
import org.bench4q.share.models.master.plugin.PluginResponseModel;
|
||||
import org.bench4q.share.models.master.plugin.PluginUIModel;
|
||||
import org.springframework.stereotype.Component;
|
||||
|
||||
@Component
|
||||
public class PluginService {
|
||||
|
||||
public List<PluginInfoModel> extractPluginInfoModels(
|
||||
PluginResponseModel pluginResponseModel) {
|
||||
|
||||
List<PluginInfoModel> pluginInfoModels = new LinkedList<PluginInfoModel>();
|
||||
if (pluginResponseModel == null
|
||||
|| pluginResponseModel.getPluginUIModels() == null) {
|
||||
return pluginInfoModels;
|
||||
} else {
|
||||
for (PluginUIModel pluginUIModel : pluginResponseModel
|
||||
.getPluginUIModels()) {
|
||||
pluginInfoModels.add(pluginUIModel.getPluginInfoModel());
|
||||
}
|
||||
return pluginInfoModels;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
masterAddress=127.0.1.1:7979/
|
||||
masterAddress=133.133.12.1:7979/
|
||||
|
|
@ -1,225 +1,262 @@
|
|||
.inset {
|
||||
width: 85%;
|
||||
height: 80%;
|
||||
align: center;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.scroll {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.button-div {
|
||||
margin-top: 50px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.button-div div {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.behavior_box {
|
||||
border: 1px inset;
|
||||
width: 200px;
|
||||
height: 300px;
|
||||
margin-right: 0px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
td,th {
|
||||
width: 230px;
|
||||
padding-top: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.table-margin {
|
||||
margin-top: 10px;
|
||||
padding-top: 5px;
|
||||
padding-left: 20px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.sample_frame {
|
||||
padding: 10px;
|
||||
margin: 5px 5px 5px 5px;
|
||||
border: #E8F2FE solid thin;
|
||||
}
|
||||
|
||||
.sample_sub_frame {
|
||||
border: #F0ECE0 solid thin;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.btn-width {
|
||||
width: 85px;
|
||||
}
|
||||
|
||||
.btn-large {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.listArea {
|
||||
height: 340px;
|
||||
margin-bottom: 15px;
|
||||
outline-style: outset;
|
||||
outline-color: #A0D0EC;
|
||||
/* color: black; */
|
||||
}
|
||||
|
||||
.behavior-box {
|
||||
height: 400px;
|
||||
border: 1px solid #3689BB;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
#myModal_Behavior {
|
||||
width: 800px;
|
||||
left: 40%;
|
||||
}
|
||||
|
||||
.listArea,#insertPluginAreaPlugins,#pluginMethod p,a {
|
||||
padding-top: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
#pluginMethod {
|
||||
padding-top: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
p,a {
|
||||
color: #4E9BCB;
|
||||
/* border-bottom: 1px solid #F0ECE0; */
|
||||
}
|
||||
|
||||
#submitBehaviors p {
|
||||
margin-top: 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.visited {
|
||||
background-color: #E8F2FE;
|
||||
}
|
||||
|
||||
.tab .nav li a:hover,.nav>li>a:focus {
|
||||
text-decoration: none;
|
||||
background-color: #E5E3E9;
|
||||
}
|
||||
|
||||
.tab .nav-tabs {
|
||||
border-bottom: 1px solid #F7F5FA;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tab .nav {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tab {
|
||||
background-color: #F7F5FA;
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 5px;
|
||||
padding-top: -10px;
|
||||
}
|
||||
|
||||
.tab ul {
|
||||
/* zoom: 1; */
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.tab ul:after {
|
||||
display: block;
|
||||
height: 0px;
|
||||
visibility: hidden;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.tab ul li {
|
||||
margin-bottom: -10px;
|
||||
text-align: center;
|
||||
line-height: 100%;
|
||||
width: 20%;
|
||||
display: inline;
|
||||
float: left;
|
||||
height: 26px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tab ul li.on {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.tabContent .span10 {
|
||||
margin-left: -25px;
|
||||
}
|
||||
|
||||
.help_step_box {
|
||||
background: #f1f7e4;
|
||||
height: 55px;
|
||||
overflow: hidden;
|
||||
border-top: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.help_step_item {
|
||||
float: left;
|
||||
height: 55px;
|
||||
line-height: 55px;
|
||||
padding: 0 25px 0 45px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.help_step_num {
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
line-height: 19px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 18px;
|
||||
left: 20px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/num.png);
|
||||
color: #156600;
|
||||
}
|
||||
|
||||
.help_step_set {
|
||||
background: #27a806;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.help_step_set .help_step_left {
|
||||
width: 8px;
|
||||
height: 55px;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/bak.jpg)
|
||||
left top no-repeat;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.help_step_set .help_step_right {
|
||||
width: 8px;
|
||||
height: 55px;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/bak.jpg)
|
||||
left bottom no-repeat;
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.btn-page{
|
||||
background-color:#50A8DC;
|
||||
margin-top:20px;
|
||||
margin-bottom:20px;
|
||||
|
||||
}
|
||||
|
||||
label {
|
||||
display: inline;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-right: 5px;
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
.editor {
|
||||
background-color: #f5f5f5;
|
||||
border-top-color: #dcdcdc;
|
||||
width: 400px;
|
||||
border: 1px solid #d5d5d5;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
.editor div {
|
||||
|
||||
}
|
||||
|
||||
.editor p {
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 10px;
|
||||
|
||||
}
|
||||
|
||||
.editor button {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.inset {
|
||||
width: 85%;
|
||||
height: 80%;
|
||||
align: center;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.scroll {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.button-div {
|
||||
margin-top: 50px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.button-div div {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.behavior_box {
|
||||
border: 1px inset;
|
||||
width: 200px;
|
||||
height: 300px;
|
||||
margin-right: 0px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
td,th {
|
||||
width: 230px;
|
||||
padding-top: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.table-margin {
|
||||
margin-top: 10px;
|
||||
padding-top: 5px;
|
||||
padding-left: 20px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.sample_frame {
|
||||
padding: 10px;
|
||||
margin: 5px 5px 5px 5px;
|
||||
border: #E8F2FE solid thin;
|
||||
}
|
||||
|
||||
.sample_sub_frame {
|
||||
border: #F0ECE0 solid thin;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.btn-width {
|
||||
width: 85px;
|
||||
}
|
||||
|
||||
.btn-large {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.listArea {
|
||||
height: 340px;
|
||||
margin-bottom: 15px;
|
||||
outline-style: outset;
|
||||
outline-color: #A0D0EC;
|
||||
/* color: black; */
|
||||
}
|
||||
|
||||
.behavior-box {
|
||||
height: 400px;
|
||||
border: 1px solid #3689BB;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
#myModal_Behavior {
|
||||
width: 800px;
|
||||
left: 40%;
|
||||
}
|
||||
|
||||
.listArea,#insertPluginAreaPlugins,#pluginMethod p,a {
|
||||
padding-top: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
#pluginMethod {
|
||||
padding-top: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #4E9BCB;
|
||||
/* border-bottom: 1px solid #F0ECE0; */
|
||||
}
|
||||
|
||||
#submitBehaviors p {
|
||||
margin-top: 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.visited {
|
||||
background-color: #E8F2FE;
|
||||
}
|
||||
|
||||
.tab .nav li a:hover,.nav>li>a:focus {
|
||||
text-decoration: none;
|
||||
background-color: #E5E3E9;
|
||||
}
|
||||
|
||||
.tab .nav-tabs {
|
||||
border-bottom: 1px solid #F7F5FA;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.tab .nav {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tab {
|
||||
background-color: #F7F5FA;
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 5px;
|
||||
padding-top: -10px;
|
||||
}
|
||||
|
||||
.tab ul {
|
||||
/* zoom: 1; */
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.tab ul:after {
|
||||
display: block;
|
||||
height: 0px;
|
||||
visibility: hidden;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.tab ul li {
|
||||
margin-bottom: -10px;
|
||||
text-align: center;
|
||||
line-height: 100%;
|
||||
width: 20%;
|
||||
display: inline;
|
||||
float: left;
|
||||
height: 26px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tab ul li.on {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.tabContent .span10 {
|
||||
margin-left: -25px;
|
||||
}
|
||||
|
||||
.help_step_box {
|
||||
background: #f1f7e4;
|
||||
height: 55px;
|
||||
overflow: hidden;
|
||||
border-top: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.help_step_item {
|
||||
float: left;
|
||||
height: 55px;
|
||||
line-height: 55px;
|
||||
padding: 0 25px 0 45px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.help_step_num {
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
line-height: 19px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 18px;
|
||||
left: 20px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/num.png);
|
||||
color: #156600;
|
||||
}
|
||||
|
||||
.help_step_set {
|
||||
background: #27a806;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.help_step_set .help_step_left {
|
||||
width: 8px;
|
||||
height: 55px;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/bak.jpg)
|
||||
left top no-repeat;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.help_step_set .help_step_right {
|
||||
width: 8px;
|
||||
height: 55px;
|
||||
background: url(http://www.codefans.net/jscss/demoimg/201011/bak.jpg)
|
||||
left bottom no-repeat;
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.btn-page {
|
||||
background-color: #50A8DC;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
function createFile(label, name, size, id) {
|
||||
|
||||
var div = baseCreateEditor(label, id);
|
||||
|
||||
var fileEditor = document.createElement("div");
|
||||
|
||||
var fieldName = document.createElement("label");
|
||||
$(fieldName).html(name + ":");
|
||||
var file = document.createElement("input");
|
||||
$(file).attr("type", "file");
|
||||
$(file).attr("size", size);
|
||||
$(fileEditor).append(fieldName.outerHTML + file.outerHTML);
|
||||
$(div).append(fileEditor);
|
||||
return div;
|
||||
}
|
||||
function createTable(label,cols,value,id){
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
function createTable(label, name, cols, value, behaviorIndex) {
|
||||
var table_content = cols.split(";");// table分隔符
|
||||
var col = table_content.length;
|
||||
var tableWidth = 300 / col;
|
||||
var tr = document.createElement("tr");
|
||||
for (var i = 0; i < col; i++) {
|
||||
var th = document.createElement("th");
|
||||
var text = document.createTextNode(table_content[i]);
|
||||
th.appendChild(text);
|
||||
tr.appendChild(th);
|
||||
}
|
||||
var divNode = document.createElement("div");
|
||||
var p = document.createElement("p");
|
||||
var labelNode = document.createTextNode(label);
|
||||
var div = document.createElement("div");
|
||||
var nameNode = document.createTextNode(name);
|
||||
var br1 = document.createElement("br");
|
||||
var br2 = document.createElement("br");
|
||||
var addColButton = document.createElement("button");
|
||||
var addColNode = document.createTextNode($.i18n.prop("addCol"));
|
||||
var removeColButton = document.createElement("button");
|
||||
var removeColNode = document.createTextNode($.i18n.prop("removeCol"));
|
||||
var table = document.createElement("table");
|
||||
var thead = document.createElement("thead");
|
||||
var tbody = document.createElement("tbody");
|
||||
|
||||
if (value != null) {
|
||||
value = value.split("|;");// 一行的信息
|
||||
var row = value.length - 1;
|
||||
for (var m = 0; m < row; m++) {
|
||||
var colValue = value[m].split("|");// 一行中的每列信息
|
||||
var trNode = document.createElement("tr");
|
||||
for (var n = 0; n < col; n++) {
|
||||
var tdNode = document.createElement("td");
|
||||
var input = document.createElement("input");
|
||||
input.setAttribute("size", 10);
|
||||
input.setAttribute("type", "text");
|
||||
input.setAttribute("style", "width:" + tableWidth + "px;");
|
||||
input.setAttribute("value", colValue[n]);
|
||||
tdNode.appendChild(input);
|
||||
trNode.appendChild(tdNode);
|
||||
}
|
||||
tbody.appendChild(trNode);
|
||||
}
|
||||
}
|
||||
|
||||
$(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)");
|
||||
$(addColButton).attr("id", tableWidth);
|
||||
$(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);
|
||||
removeColButton.appendChild(removeColNode);
|
||||
thead.appendChild(tr);
|
||||
table.appendChild(thead);
|
||||
table.appendChild(tbody);
|
||||
div.appendChild(nameNode);
|
||||
div.appendChild(br1);
|
||||
div.appendChild(addColButton);
|
||||
div.appendChild(removeColButton);
|
||||
div.appendChild(br2);
|
||||
div.appendChild(table);
|
||||
divNode.appendChild(p);
|
||||
divNode.appendChild(div);
|
||||
return divNode.outerHTML;
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
$(function() {
|
||||
|
||||
$('#test').append(createContainer("test", "test"));
|
||||
});
|
||||
function baseCreateEditor(label, id) {
|
||||
var div = document.createElement("div");
|
||||
$(div).addClass("editor");
|
||||
$(div).attr("id", id);
|
||||
var p = document.createElement("p")
|
||||
$(p).html(label);
|
||||
$(div).append(p);
|
||||
return div;
|
||||
}
|
||||
|
||||
function createField(label, name, size, id) {
|
||||
var div = baseCreateEditor(label, id);
|
||||
$(div).append(createFieldLine(size, name));
|
||||
return div;
|
||||
}
|
||||
|
||||
function createFieldLine(size, name) {
|
||||
if (size <= 0) {
|
||||
size = 10;
|
||||
}
|
||||
var fieldDiv = document.createElement("div");
|
||||
$(fieldDiv).attr("class", "field");
|
||||
var fieldName = document.createElement("label");
|
||||
$(fieldName).html(name + ":");
|
||||
var field = document.createElement("input");
|
||||
$(field).attr("type", "text");
|
||||
$(field).attr("size", size);
|
||||
$(fieldDiv).append(fieldName.outerHTML + field.outerHTML);
|
||||
return fieldDiv;
|
||||
}
|
||||
|
||||
function createMultiField(label, name, size, id) {
|
||||
var div = createField(label, name, size, id);
|
||||
var addFieldButton = document.createElement("button");
|
||||
$(addFieldButton).html("add")
|
||||
|
||||
$(addFieldButton).attr("type", "submit");
|
||||
$(addFieldButton).click(function(event) {
|
||||
event.preventDefault()
|
||||
$(createFieldLine(size, name)).insertBefore($(this));
|
||||
});
|
||||
var removeFieldButton = document.createElement("button");
|
||||
$(removeFieldButton).html("remove")
|
||||
$(removeFieldButton).attr("type", "submit");
|
||||
$(removeFieldButton).click(function(event) {
|
||||
event.preventDefault();
|
||||
$(this).parent().children(".field").last().remove();
|
||||
|
||||
});
|
||||
|
||||
$(div).append(addFieldButton).append(removeFieldButton);
|
||||
|
||||
return div;
|
||||
}
|
||||
|
||||
function createContainer(id, name) {
|
||||
|
||||
var div = document.createElement("div");
|
||||
|
||||
$(div).attr("id", id);
|
||||
$(div).append(createMultiField("test", "name", 10, "test"));
|
||||
$(div).append(createFile("file", "file name", 10, "file"));
|
||||
$(div).append(createField("field", "field name", 10, "field"));
|
||||
return div;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>test add field</title>
|
||||
<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">
|
||||
<link href="../../lib/chrisma/css/charisma-app.css" rel="stylesheet">
|
||||
<link href="../../css/bench4q.css" rel="stylesheet">
|
||||
<link href='../../css/plugin.css' rel='stylesheet'>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="test"></div>
|
||||
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.0.min.js"></script>
|
||||
<script src="js/createMultiField.js"></script>
|
||||
<script src="js/createFile.js"></script>
|
||||
<script src="http://code.jquery.com/qunit/qunit-1.14.0.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,20 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>first test with Qunit</title>
|
||||
<link rel="stylesheet"
|
||||
href="http://code.jquery.com/qunit/qunit-1.14.0.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="qunit"></div>
|
||||
<div id="qunit-fixture"></div>
|
||||
<div>
|
||||
<span data="num">2</span> <span>+</span> <span data="num">3</span><span>=</span><span
|
||||
data="result"></span>
|
||||
</div>
|
||||
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.0.min.js"></script>
|
||||
<script src="http://code.jquery.com/qunit/qunit-1.14.0.js"></script>
|
||||
<script src="js/testMap.js"></script>
|
||||
<html lang="en"><head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Raphaël · Graffle</title>
|
||||
<link rel="stylesheet" href="demo.css" type="text/css" media="screen">
|
||||
<link rel="stylesheet" href="demo-print.css" type="text/css" media="print">
|
||||
<script src="https://raw.githubusercontent.com/DmitryBaranovskiy/raphael/master/raphael-min.js"></script>
|
||||
<script src="graffle.js" type="text/javascript" charset="utf-8"></script>
|
||||
<style type="text/css" media="screen">
|
||||
#holder {
|
||||
-moz-border-radius: 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
border: solid 1px #333;
|
||||
}
|
||||
p {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Drag shapes around.</p>
|
||||
<div id="holder"><svg height="480" version="1.1" width="640" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative;"><desc style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);">Created with Raphaël 2.1.2</desc><defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></defs><ellipse cx="190" cy="100" rx="30" ry="20" fill="#bf0000" stroke="#bf0000" fill-opacity="0" stroke-width="2" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); fill-opacity: 0; cursor: move;"></ellipse><rect x="290" y="80" width="60" height="40" r="10" rx="10" ry="10" fill="#bf5600" stroke="#bf5600" fill-opacity="0" stroke-width="2" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); fill-opacity: 0; cursor: move;"></rect><rect x="290" y="180" width="60" height="40" r="2" rx="2" ry="2" fill="#bfac00" stroke="#bfac00" fill-opacity="0" stroke-width="2" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); fill-opacity: 0; cursor: move;"></rect><ellipse cx="450" cy="100" rx="20" ry="20" fill="#7cbf00" stroke="#7cbf00" fill-opacity="0" stroke-width="2" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); fill-opacity: 0; cursor: move;"></ellipse><path fill="none" stroke="#ffffff" d="M221.045,100C255.022,100,255.022,100,289,100" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path><path fill="none" stroke="#ffffff" d="M320,121C320,150,320,150,320,179" stroke-width="5" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path><path fill="none" stroke="#ffffff" d="M320,121C320,150,320,150,320,179" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path><path fill="none" stroke="#ffffff" d="M351,100C389.985,100,389.985,100,428.97,100" stroke-width="3" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path><path fill="none" stroke="#000000" d="M351,100C389.985,100,389.985,100,428.97,100" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path></svg></div>
|
||||
<p id="copy">Demo of <a href="http://raphaeljs.com/">Raphaël</a>—JavaScript Vector Library</p>
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue