diff --git a/script.js b/script.js
index f5adc93d..a6320f67 100644
--- a/script.js
+++ b/script.js
@@ -497,19 +497,45 @@ function initialize()
monstersList.appendChild(fragment);
//标题和介绍文本框
- const txtTitle = formationBox.querySelector(".title-box .title");
- const txtDetail = formationBox.querySelector(".detail-box .detail");
+ const titleBox = formationBox.querySelector(".title-box");
+ const detailBox = formationBox.querySelector(".detail-box");
+ const txtTitle = titleBox.querySelector(".title");
+ const txtDetail = detailBox.querySelector(".detail");
+ const txtTitleDisplay = titleBox.querySelector(".title-display");
+ const txtDetailDisplay = detailBox.querySelector(".detail-display");
txtTitle.onchange = function(){
formation.title = this.value;
+ //txtTitleDisplay.innerHTML = "";
+ //txtTitleDisplay.appendChild(document.createTextNode(this.value));
+ txtTitleDisplay.innerHTML = descriptionToHTML(this.value);
creatNewUrl();
};
+ txtTitle.onblur = function(){
+ titleBox.classList.remove("edit");
+ };
txtDetail.onchange = function(){
formation.detail = this.value;
+ /*txtDetailDisplay.innerHTML = "";
+ const txtDetailLines = this.value.split("\n");
+ txtDetailLines.forEach((line,idx)=>{
+ if (idx>0) txtDetailDisplay.appendChild(document.createElement("br"));
+ txtDetailDisplay.appendChild(document.createTextNode(line));
+ });*/
+ txtDetailDisplay.innerHTML = descriptionToHTML(this.value);
creatNewUrl();
};
txtDetail.onblur = function(){
- this.style.height=this.scrollHeight+"px";
+ detailBox.classList.remove("edit");
+ this.style.height = txtDetailDisplay.scrollHeight+"px";
};
+ txtTitleDisplay.onclick = function(){
+ titleBox.classList.add("edit");
+ txtTitle.focus();
+ }
+ txtDetailDisplay.onclick = function(){
+ detailBox.classList.add("edit");
+ txtDetail.focus();
+ }
for (let ti=0,ti_len=formationBox.querySelectorAll(".team-bigbox").length;ti
{
+ if (idx>0) txtDetailDisplay.appendChild(document.createElement("br"));
+ txtDetailDisplay.appendChild(document.createTextNode(line));
+ });*/
teamBigBoxs.forEach((teamBigBox,teamNum)=>{
const teamBox = teamBigBox.querySelector(".team-box");
diff --git a/solo.html b/solo.html
index 6d4f11a6..10f7e6a0 100644
--- a/solo.html
+++ b/solo.html
@@ -38,7 +38,7 @@ var formation = new Formation(teamsCount,6);
diff --git a/style.css b/style.css
index 578b5541..b3040b29 100644
--- a/style.css
+++ b/style.css
@@ -40,27 +40,51 @@ body{
.help-link::before{
content: "Help & Tips";
}
-.title{
+.title,
+.title-display
+{
font-size: 2em;
font-weight: bold;
}
-.detail{
+.detail,
+.detail-display
+{
min-height: 100px;
font-size: 1.5em;
- font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
}
-.title,.detail{
+.title,
+.detail,
+.title-display,
+.detail-display
+{
+ font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
width:100%;
border: none;
background: none;
box-sizing: border-box;
padding: 1px;
+ margin: 0;
}
.title:focus,.detail:focus{
border: black solid 1px;;
background-color: #eee;
padding: 0;
}
+.title,
+.detail
+{
+ display: none;
+}
+.edit .title,
+.edit .detail
+{
+ display: block;
+}
+.edit .title-display,
+.edit .detail-display
+{
+ display: none;
+}
.status{
line-height: 16px;
}
@@ -609,28 +633,43 @@ ul{
}
.edit-box .setting-box .row-mon-id .evo-card-list li,
.edit-box .search-box .search-mon-list li,
-.edit-box .setting-box .skill-box .detail-mon{
+.detail-mon{
display: inline-block;
vertical-align: top;
top: 0;
- width: 78px;
- height: 80px;
+ width: 80px;
+ height: 78px;
}
-.edit-box .setting-box .skill-box .detail-mon{
+.detail-mon{
vertical-align: bottom;
}
.edit-box .setting-box .row-mon-id .evo-card-list .monster,
.edit-box .search-box .search-mon-list .monster,
-.edit-box .setting-box .skill-box .detail-mon .monster{
+.detail-mon .monster{
float: none;
- transform: scale(0.75) translate(-13px,-13px);
+ transform: scale(0.75) translate(-16px,-16px);
}
.edit-box .setting-box .row-mon-id .evo-card-list .monster .id,
.edit-box .search-box .search-mon-list .monster .id,
-.edit-box .setting-box .skill-box .detail-mon .monster .id{
+.detail-mon .monster .id{
bottom: 5px;
font-size: 20px;
}
+
+.detail-box .detail-mon{
+ width: 50px;
+ height: 50px;
+}
+.detail-box .detail-mon .monster{
+ transform: scale(0.5) translate(-58px,-58px);
+}
+.detail-box .detail-mon .monster .id{
+ font-weight: bold;
+ font-size: 23px;
+}
+.detail-box .detail-mon .monster .id::before {
+ font-size: 15px;
+}
/*.setting-box .row-mon-id .open-search::before{
content: "搜索怪物";
}
diff --git a/triple.html b/triple.html
index 5a6e6f7c..e3c829d1 100644
--- a/triple.html
+++ b/triple.html
@@ -22,6 +22,12 @@ var formation = new Formation(teamsCount,6);
width: 756px;
min-width: 756px;
}
+.team-bigbox{
+ border-top: 1px solid gray;
+}
+.team-bigbox:first-of-type{
+ border-top: none;
+}
@@ -45,7 +51,7 @@ var formation = new Formation(teamsCount,6);
diff --git a/universal_function.js b/universal_function.js
index 7fca2fd1..e2215996 100644
--- a/universal_function.js
+++ b/universal_function.js
@@ -336,10 +336,33 @@ function createCardA(id)
//将怪物的文字介绍解析为HTML
function descriptionToHTML(str)
{
- str = str.replace("\n","
");
- str = str.replace(/\^(\w+)\^(.+)\^p/igm,'
$2');
+ str = str.replace(/\n/igm,"
");
+ str = str.replace(/\^([a-fA-F0-9]{6})\^([^\^]+)\^p/igm,'
$2');
+ let monReg = /\%\{m([0-9]{1,4})\}/igm;
+ let monRegRes;
+
+ while((monRegRes = monReg.exec(str))!=null) {
+ str = str.replace(monRegRes[0],cardN(parseInt(monRegRes[1])));
+ }
+ //str = str.replace(/\%\{m([0-9]{1,4})\}/igm,cardN(`$1`));
return str;
}
+//返回怪物名
+function cardN(id){
+ let card = Cards[id || 0];
+ if (!card)
+ {
+ return "没有该宠物 " + id;
+ }else
+ {
+ const monOuterDom = document.createElement("span");
+ monOuterDom.className = "detail-mon";
+ const monDom = createCardA(id);
+ monOuterDom.appendChild(monDom);
+ changeid({id:id},monDom);
+ return monOuterDom.outerHTML;
+ }
+}
//默认的技能解释的显示行为
function parseSkillDescription(skill)
{